Nazwany kolor · #E7CEE3
Sweety Pie
Sweety Pie to #E7CEE3: rgb(231 206 227), hsl(310 34% 86%), oklch(0.878 0.039 331.2). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Pink mean? → · Sweety Pie color name →
#E7CEE3
oklch(0.878 0.039 331.2)
Konwersje koloru
- HEX
- #e7cee3
- RGB
- rgb(231 206 227)
- HSL
- hsl(310 34% 86%)
- HWB
- hwb(310 81% 9%)
- OKLCH
- oklch(0.878 0.039 331.2)
- OKLab
- oklab(0.878 0.034 -0.019)
- CIE Lab
- lab(85.34 11.7 -7.06)
- LCH
- lch(85.34 13.66 328.9)
- CMYK
- cmyk(0% 11% 2% 9%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- E9D3E6
- ECD8E9
- EEDDEB
- F1E1EE
- F3E6F1
- F6EBF4
- F8F0F7
- FAF5F9
- FDFAFC
Odcienie ciemniejsze
- C9B3C5
- AB98A8
- 8F7F8C
- 736671
- 594E57
- 40383F
- 282327
- 130F12
- 030203
Tony
- DCC6D9
- D2BECE
- C7B6C4
- BDAEBA
- B2A6B0
- A89EA6
- 9E979D
- 948F93
- 8A8889
Harmonie kolorów
Komplementarna +180°
- E7CEE3
Sweety Pie
- C5DFCA
≈ Spring Burst
Analogowa -30° +30°
- E7CEE3
Sweety Pie
- DBD1ED
≈ Shimmering Sky
- EECDD5
≈ Donquixote Doflamingo
Triada +120° +240°
- E7CEE3
Sweety Pie
- E0D7BA
≈ Physalis Peal
- BADEE6
≈ Disappearing Island
Komplementarna rozszczepiona +150° +210°
- E7CEE3
Sweety Pie
- D3DBBF
≈ Zen Garden
- BCE0D8
≈ Antiguan
Tetrada +90° +180° +270°
- E7CEE3
Sweety Pie
- EBD2BD
≈ Puppy Paws
- C5DFCA
≈ Spring Burst
- C1DBEF
≈ Comet Tail
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.46:1 · APCA Lc 22
Ag
AAANa czerni
WCAG 14.33:1 · APCA Lc 81
Najlepszy kolor tekstu: #000000
WCAG 14.33:1 (AAA) · APCA Lc 81
Contrast pairs
Fragmenty kodu
CSS
:root {
--sweety-pie: #e7cee3;
--sweety-pie-rgb: 231 206 227;
--sweety-pie-oklch: oklch(0.878 0.039 331.2);
}
.element {
color: var(--sweety-pie);
background-color: hsl(310 34% 86%);
border-color: oklch(0.878 0.039 331.2);
}Tailwind CSS v4
@theme {
--color-sweety-pie: #e7cee3;
--color-sweety-pie-50: #fdf1fa;
--color-sweety-pie-100: #f0e3ee;
--color-sweety-pie-200: #dfcedb;
--color-sweety-pie-300: #c4b0c0;
--color-sweety-pie-400: #ad96a9;
--color-sweety-pie-500: #967d92;
--color-sweety-pie-600: #7f6a7c;
--color-sweety-pie-700: #665563;
--color-sweety-pie-800: #4a3e49;
--color-sweety-pie-900: #342a33;
--color-sweety-pie-950: #1f181e;
}SCSS
$sweety-pie: #e7cee3;
$sweety-pie-rgb: 231, 206, 227;
$sweety-pie-light: mix(#fff, $sweety-pie, 20%);
$sweety-pie-dark: mix(#000, $sweety-pie, 20%);
.element {
color: $sweety-pie;
box-shadow: 0 0 0 2px rgba($sweety-pie, 0.35);
}