色名 · #F0D9E0
Dolce Pink
Dolce Pinkは#F0D9E0：rgb(240 217 224)、hsl(342 43% 90%)、oklch(0.906 0.027 357.2)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Gray mean? → · Dolce Pink color name →
#F0D9E0
oklch(0.906 0.027 357.2)
カラー変換
- HEX
- #f0d9e0
- RGB
- rgb(240 217 224)
- HSL
- hsl(342 43% 90%)
- HWB
- hwb(342 85% 6%)
- OKLCH
- oklch(0.906 0.027 357.2)
- OKLab
- oklab(0.906 0.027 -0.001)
- CIE Lab
- lab(88.76 9.07 -0.41)
- LCH
- lch(88.76 9.08 357.4)
- CMYK
- cmyk(0% 10% 7% 6%)
ティント · シェード · トーン
ティント
- F2DDE3
- F3E1E6
- F5E4E9
- F6E8EC
- F8ECEF
- F9F0F3
- FBF4F6
- FCF7F9
- FEFBFC
シェード
- D1BCC3
- B2A1A6
- 95868A
- 786C70
- 5D5356
- 433B3E
- 2A2527
- 141112
- 030202
トーン
- E4D0D6
- D9C7CC
- CDBDC2
- C2B4B8
- B7ABAF
- ABA3A5
- A09A9C
- 959192
- 8B8989
カラーハーモニー
補色 +180°
- F0D9E0
Dolce Pink
- CEE6E0
≈ Ice Dagger
類似色 -30° +30°
- F0D9E0
Dolce Pink
- EADAE9
≈ Elfin Magic
- F2DAD6
≈ Light Apricot
トライアド +120° +240°
- F0D9E0
Dolce Pink
- DEE3CF
≈ Mystical Sea
- D0E3F0
≈ Soft Cloud
スプリットコンプリメンタリー +150° +210°
- F0D9E0
Dolce Pink
- D5E5D6
≈ Light Mystified
- CCE5E9
≈ Ivalo River
テトラード +90° +180° +270°
- F0D9E0
Dolce Pink
- E8DFCC
≈ Asian Ivory
- CEE6E0
≈ Ice Dagger
- D8E0F3
≈ Aquarelle Purple
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.33:1 · APCA Lc 17
Ag
AAA黒の上
WCAG 15.70:1 · APCA Lc 87
最適な文字色: #000000
WCAG 15.70:1 (AAA) · APCA Lc 87
Contrast pairs
コードスニペット
CSS
:root {
--dolce-pink: #f0d9e0;
--dolce-pink-rgb: 240 217 224;
--dolce-pink-oklch: oklch(0.906 0.027 357.2);
}
.element {
color: var(--dolce-pink);
background-color: hsl(342 43% 90%);
border-color: oklch(0.906 0.027 357.2);
}Tailwind CSS v4
@theme {
--color-dolce-pink: #f0d9e0;
--color-dolce-pink-50: #fcf2f5;
--color-dolce-pink-100: #f0e4e7;
--color-dolce-pink-200: #dfd0d4;
--color-dolce-pink-300: #c4b2b7;
--color-dolce-pink-400: #ad989e;
--color-dolce-pink-500: #967f86;
--color-dolce-pink-600: #7f6c72;
--color-dolce-pink-700: #65565b;
--color-dolce-pink-800: #4a3f43;
--color-dolce-pink-900: #342b2e;
--color-dolce-pink-950: #1f181b;
}SCSS
$dolce-pink: #f0d9e0;
$dolce-pink-rgb: 240, 217, 224;
$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);
}