Nazwany kolor · #D5E1E0
Pristine Petal
Pristine Petal to #D5E1E0: rgb(213 225 224), hsl(175 17% 86%), oklch(0.9 0.013 190.9). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Pristine Petal color name →
#D5E1E0
oklch(0.9 0.013 190.9)
Konwersje koloru
- HEX
- #d5e1e0
- RGB
- rgb(213 225 224)
- HSL
- hsl(175 17% 86%)
- HWB
- hwb(175 84% 12%)
- OKLCH
- oklch(0.9 0.013 190.9)
- OKLab
- oklab(0.9 -0.013 -0.002)
- CIE Lab
- lab(88.59 -4.3 -0.97)
- LCH
- lch(88.59 4.41 192.8)
- CMYK
- cmyk(5% 0% 0% 12%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- D9E4E3
- DDE7E6
- E2EAE9
- E6EDEC
- EAF0EF
- EEF3F3
- F2F6F6
- F7F9F9
- FBFCFC
Odcienie ciemniejsze
- B9C4C3
- 9EA7A6
- 838B8A
- 6A7070
- 515656
- 3A3E3E
- 242727
- 101212
- 020202
Tony
- CCD7D6
- C3CDCC
- BBC3C2
- B2B9B8
- AAAFAF
- A1A6A5
- 999C9C
- 909392
- 888989
Harmonie kolorów
Komplementarna +180°
- D5E1E0
Pristine Petal
- E6DBDC
≈ White Cherry
Analogowa -30° +30°
- D5E1E0
Pristine Petal
- D7E1DB
≈ Night Wind
- D5E0E4
≈ Blue Smoke
Triada +120° +240°
- D5E1E0
Pristine Petal
- E1DCE5
≈ Minified Mauve
- E4DDD5
≈ Everyday White
Komplementarna rozszczepiona +150° +210°
- D5E1E0
Pristine Petal
- E5DBE1
≈ Violet Vapour
- E6DBD8
≈ Light Porcelain
Tetrada +90° +180° +270°
- D5E1E0
Pristine Petal
- DCDDE7
≈ Hosta Flower
- E6DBDC
≈ White Cherry
- E0DED5
≈ Black Haze
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.33:1 · APCA Lc 17
Ag
AAANa czerni
WCAG 15.67:1 · APCA Lc 87
Najlepszy kolor tekstu: #000000
WCAG 15.67:1 (AAA) · APCA Lc 87
Contrast pairs
Fragmenty kodu
CSS
:root {
--pristine-petal: #d5e1e0;
--pristine-petal-rgb: 213 225 224;
--pristine-petal-oklch: oklch(0.9 0.013 190.9);
}
.element {
color: var(--pristine-petal);
background-color: hsl(175 17% 86%);
border-color: oklch(0.9 0.013 190.9);
}Tailwind CSS v4
@theme {
--color-pristine-petal: #d5e1e0;
--color-pristine-petal-50: #f1f6f6;
--color-pristine-petal-100: #e3e9e9;
--color-pristine-petal-200: #ced6d6;
--color-pristine-petal-300: #b0bab9;
--color-pristine-petal-400: #96a1a0;
--color-pristine-petal-500: #7d8988;
--color-pristine-petal-600: #6a7473;
--color-pristine-petal-700: #555d5c;
--color-pristine-petal-800: #3e4443;
--color-pristine-petal-900: #2a2f2e;
--color-pristine-petal-950: #181b1b;
}SCSS
$pristine-petal: #d5e1e0;
$pristine-petal-rgb: 213, 225, 224;
$pristine-petal-light: mix(#fff, $pristine-petal, 20%);
$pristine-petal-dark: mix(#000, $pristine-petal, 20%);
.element {
color: $pristine-petal;
box-shadow: 0 0 0 2px rgba($pristine-petal, 0.35);
}