最も近い色名 · #F1D9E4
#F1D9E4
最も近い色名: Dolce Pink
#F1D9E4(rgb(241 217 228)、hsl(332 46% 90%)、oklch(0.908 0.03 348.2))に最も近い色名はDolce Pinkです。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
#F1D9E4
oklch(0.908 0.03 348.2)
カラー変換
- HEX
- #f1d9e4
- RGB
- rgb(241 217 228)
- HSL
- hsl(332 46% 90%)
- HWB
- hwb(332 85% 5%)
- OKLCH
- oklch(0.908 0.03 348.2)
- OKLab
- oklab(0.908 0.029 -0.006)
- CIE Lab
- lab(88.93 9.94 -2.23)
- LCH
- lch(88.93 10.18 347.3)
- CMYK
- cmyk(0% 10% 5% 5%)
ティント · シェード · トーン
ティント
- F2DDE7
- F4E1E9
- F5E4EC
- F7E8EF
- F8ECF1
- FAF0F4
- FBF4F7
- FCF7FA
- FEFBFC
シェード
- D2BCC6
- B3A1A9
- 95868D
- 796C72
- 5D5358
- 433B3F
- 2B2528
- 141112
- 030203
トーン
- E5D0DA
- D9C7CF
- CEBDC5
- C2B4BB
- B7ABB1
- ACA3A7
- A19A9D
- 969193
- 8B898A
カラーハーモニー
補色 +180°
- F1D9E4
Dolce Pink
- CEE7DD
≈ Light Otto Ice
類似色 -30° +30°
- F1D9E4
Dolce Pink
- E9DBEE
≈ Princess Fairy Tale
- F4D9D9
≈ Frosted Tulip
トライアド +120° +240°
- F1D9E4
Dolce Pink
- E2E3CC
≈ Yellow Phosphenes
- CDE5F1
≈ First Frost
スプリットコンプリメンタリー +150° +210°
- F1D9E4
Dolce Pink
- D7E6D3
≈ Light Spring Burst
- CBE7E8
≈ Starship Tonic
テトラード +90° +180° +270°
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.33:1 · APCA Lc 16
Ag
AAA黒の上
WCAG 15.78:1 · APCA Lc 87
最適な文字色: #000000
WCAG 15.78:1 (AAA) · APCA Lc 87
Contrast pairs
コードスニペット
CSS
:root {
--dolce-pink: #f1d9e4;
--dolce-pink-rgb: 241 217 228;
--dolce-pink-oklch: oklch(0.908 0.03 348.2);
}
.element {
color: var(--dolce-pink);
background-color: hsl(332 46% 90%);
border-color: oklch(0.908 0.03 348.2);
}Tailwind CSS v4
@theme {
--color-dolce-pink: #f1d9e4;
--color-dolce-pink-50: #fcf2f6;
--color-dolce-pink-100: #f0e4e9;
--color-dolce-pink-200: #dfcfd6;
--color-dolce-pink-300: #c4b1b9;
--color-dolce-pink-400: #ad98a1;
--color-dolce-pink-500: #967e8a;
--color-dolce-pink-600: #7f6b74;
--color-dolce-pink-700: #66565d;
--color-dolce-pink-800: #4b3e44;
--color-dolce-pink-900: #342b2f;
--color-dolce-pink-950: #1f181c;
}SCSS
$dolce-pink: #f1d9e4;
$dolce-pink-rgb: 241, 217, 228;
$dolce-pink-light: mix(#fff, $dolce-pink, 20%);
$dolce-pink-dark: mix(#000, $dolce-pink, 20%);
.element {
color: $dolce-pink;
box-shadow: 0 0 0 2px rgba($dolce-pink, 0.35);
}