色名 · #FCD1BF
Petal Soft
Petal Softは#FCD1BF：rgb(252 209 191)、hsl(18 91% 87%)、oklch(0.893 0.054 43.9)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Pink mean? → · Petal Soft color name →
#FCD1BF
oklch(0.893 0.054 43.9)
カラー変換
- HEX
- #fcd1bf
- RGB
- rgb(252 209 191)
- HSL
- hsl(18 91% 87%)
- HWB
- hwb(18 75% 1%)
- OKLCH
- oklch(0.893 0.054 43.9)
- OKLab
- oklab(0.893 0.039 0.038)
- CIE Lab
- lab(87.25 13.65 14.92)
- LCH
- lch(87.25 20.23 47.5)
- CMYK
- cmyk(0% 17% 24% 1%)
ティント · シェード · トーン
ティント
- FDD6C5
- FDDACC
- FDDFD2
- FEE3D8
- FEE8DF
- FEEDE5
- FFF1EC
- FFF6F2
- FFFAF9
シェード
- DBB5A6
- BB9B8D
- 9C8175
- 7E685E
- 625048
- 473933
- 2D231F
- 16100D
- 030202
トーン
- EFC9B9
- E2C0B2
- D6B8AC
- C9B0A5
- BDA89F
- B0A099
- A49893
- 98908C
- 8C8886
カラーハーモニー
補色 +180°
- FCD1BF
Petal Soft
- B6E4F7
≈ Breaking the Ice
類似色 -30° +30°
- FCD1BF
Petal Soft
- FECED1
≈ Love Fumes
- F2D7B5
≈ Pink Lady
トライアド +120° +240°
- FCD1BF
Petal Soft
- BCE8D2
≈ Maypole
- D7D8FF
≈ Icy Plains
スプリットコンプリメンタリー +150° +210°
- FCD1BF
Petal Soft
- B2E8E6
≈ Spearmint Water
- C4DEFF
≈ Dithered Sky
テトラード +90° +180° +270°
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.39:1 · APCA Lc 19
Ag
AAA黒の上
WCAG 15.01:1 · APCA Lc 84
最適な文字色: #000000
WCAG 15.01:1 (AAA) · APCA Lc 84
Contrast pairs
コードスニペット
CSS
:root {
--petal-soft: #fcd1bf;
--petal-soft-rgb: 252 209 191;
--petal-soft-oklch: oklch(0.893 0.054 43.9);
}
.element {
color: var(--petal-soft);
background-color: hsl(18 91% 87%);
border-color: oklch(0.893 0.054 43.9);
}Tailwind CSS v4
@theme {
--color-petal-soft: #fcd1bf;
--color-petal-soft-50: #fff1e8;
--color-petal-soft-100: #f8e3d9;
--color-petal-soft-200: #e9cec1;
--color-petal-soft-300: #d0afa0;
--color-petal-soft-400: #bb9585;
--color-petal-soft-500: #a67b69;
--color-petal-soft-600: #8c6859;
--color-petal-soft-700: #705347;
--color-petal-soft-800: #533c34;
--color-petal-soft-900: #3a2923;
--color-petal-soft-950: #241712;
}SCSS
$petal-soft: #fcd1bf;
$petal-soft-rgb: 252, 209, 191;
$petal-soft-light: mix(#fff, $petal-soft, 20%);
$petal-soft-dark: mix(#000, $petal-soft, 20%);
.element {
color: $petal-soft;
box-shadow: 0 0 0 2px rgba($petal-soft, 0.35);
}