Nazwany kolor · #F0E2E4
Dulcet Pink
Dulcet Pink to #F0E2E4: rgb(240 226 228), hsl(351 32% 91%), oklch(0.924 0.016 7.5). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Dulcet Pink color name →
#F0E2E4
oklch(0.924 0.016 7.5)
Konwersje koloru
- HEX
- #f0e2e4
- RGB
- rgb(240 226 228)
- HSL
- hsl(351 32% 91%)
- HWB
- hwb(351 89% 6%)
- OKLCH
- oklch(0.924 0.016 7.5)
- OKLab
- oklab(0.924 0.015 0.002)
- CIE Lab
- lab(91.06 5.19 0.82)
- LCH
- lch(91.06 5.25 9)
- CMYK
- cmyk(0% 6% 5% 6%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- F2E5E7
- F3E8E9
- F5EBEC
- F6EEEF
- F8F0F1
- F9F3F4
- FBF6F7
- FCF9FA
- FEFCFC
Odcienie ciemniejsze
- D1C4C6
- B2A8A9
- 958C8D
- 787172
- 5D5758
- 433E3F
- 2A2728
- 141212
- 030303
Tony
- E4D8DA
- D9CECF
- CDC4C5
- C2BABB
- B6B0B1
- ABA6A7
- A09C9D
- 959393
- 8B898A
Harmonie kolorów
Komplementarna +180°
- F0E2E4
Dulcet Pink
- DBEAE8
≈ Carefree
Analogowa -30° +30°
- F0E2E4
Dulcet Pink
- EDE2EA
≈ Heaven Sent
- F0E3DF
≈ Rosa Vieja
Triada +120° +240°
- F0E2E4
Dulcet Pink
- E3E8DD
≈ Minified Moss
- DEE7F0
≈ Radiant Moon
Komplementarna rozszczepiona +150° +210°
- F0E2E4
Dulcet Pink
- DEE9E2
≈ Frosty Pink
- DBE9ED
≈ Sidewalk Chalk Blue
Tetrada +90° +180° +270°
- F0E2E4
Dulcet Pink
- E9E6DB
≈ Narvik
- DBEAE8
≈ Carefree
- E3E5F1
≈ Crystal Falls
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.25:1 · APCA Lc 13
Ag
AAANa czerni
WCAG 16.70:1 · APCA Lc 91
Najlepszy kolor tekstu: #000000
WCAG 16.70:1 (AAA) · APCA Lc 91
Contrast pairs
Fragmenty kodu
CSS
:root {
--dulcet-pink: #f0e2e4;
--dulcet-pink-rgb: 240 226 228;
--dulcet-pink-oklch: oklch(0.924 0.016 7.5);
}
.element {
color: var(--dulcet-pink);
background-color: hsl(351 32% 91%);
border-color: oklch(0.924 0.016 7.5);
}Tailwind CSS v4
@theme {
--color-dulcet-pink: #f0e2e4;
--color-dulcet-pink-50: #f9f3f4;
--color-dulcet-pink-100: #ede6e7;
--color-dulcet-pink-200: #dbd2d3;
--color-dulcet-pink-300: #bfb4b5;
--color-dulcet-pink-400: #a79b9d;
--color-dulcet-pink-500: #908284;
--color-dulcet-pink-600: #7a6e70;
--color-dulcet-pink-700: #615859;
--color-dulcet-pink-800: #474041;
--color-dulcet-pink-900: #312c2d;
--color-dulcet-pink-950: #1d191a;
}SCSS
$dulcet-pink: #f0e2e4;
$dulcet-pink-rgb: 240, 226, 228;
$dulcet-pink-light: mix(#fff, $dulcet-pink, 20%);
$dulcet-pink-dark: mix(#000, $dulcet-pink, 20%);
.element {
color: $dulcet-pink;
box-shadow: 0 0 0 2px rgba($dulcet-pink, 0.35);
}