Nazwany kolor · #C5D0D9
Light Pre School
Light Pre School to #C5D0D9: rgb(197 208 217), hsl(207 21% 81%), oklch(0.852 0.017 242.5). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Light Pre School color name →
#C5D0D9
oklch(0.852 0.017 242.5)
Konwersje koloru
- HEX
- #c5d0d9
- RGB
- rgb(197 208 217)
- HSL
- hsl(207 21% 81%)
- HWB
- hwb(207 77% 15%)
- OKLCH
- oklch(0.852 0.017 242.5)
- OKLab
- oklab(0.852 -0.008 -0.015)
- CIE Lab
- lab(82.83 -2.56 -5.83)
- LCH
- lch(82.83 6.37 246.3)
- CMYK
- cmyk(9% 4% 0% 15%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- CBD5DD
- D0D9E1
- D6DEE4
- DCE3E8
- E2E7EC
- E8ECF0
- EDF1F4
- F3F5F7
- F9FAFB
Odcienie ciemniejsze
- ABB5BC
- 929AA1
- 798086
- 61676C
- 4B4F53
- 35393B
- 212325
- 0E1011
- 020202
Tony
- BEC8D0
- B7BFC7
- B0B7BD
- A9AFB4
- A2A7AB
- 9B9FA3
- 94979A
- 8D8F91
- 878889
Harmonie kolorów
Komplementarna +180°
- C5D0D9
Light Pre School
- D7CCC3
≈ River Rock
Analogowa -30° +30°
- C5D0D9
Light Pre School
- C2D2D5
≈ Scandinavian Sky
- CACEDA
≈ Pale Shale
Triada +120° +240°
- C5D0D9
Light Pre School
- D9CACD
≈ Captivating
- CCD0C4
≈ Pan’s Flute
Komplementarna rozszczepiona +150° +210°
- C5D0D9
Light Pre School
- D9CBC7
≈ Nut Milk
- D2CEC2
≈ Exhale
Tetrada +90° +180° +270°
- C5D0D9
Light Pre School
- D6CAD3
≈ Eternal Moonrise
- D7CCC3
≈ River Rock
- C6D2C9
≈ Milky Green
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.56:1 · APCA Lc 26
Ag
AAANa czerni
WCAG 13.39:1 · APCA Lc 77
Najlepszy kolor tekstu: #000000
WCAG 13.39:1 (AAA) · APCA Lc 77
Contrast pairs
Fragmenty kodu
CSS
:root {
--light-pre-school: #c5d0d9;
--light-pre-school-rgb: 197 208 217;
--light-pre-school-oklch: oklch(0.852 0.017 242.5);
}
.element {
color: var(--light-pre-school);
background-color: hsl(207 21% 81%);
border-color: oklch(0.852 0.017 242.5);
}Tailwind CSS v4
@theme {
--color-light-pre-school: #c5d0d9;
--color-light-pre-school-50: #f1f6fa;
--color-light-pre-school-100: #e3e9ed;
--color-light-pre-school-200: #ced5db;
--color-light-pre-school-300: #b0b9c0;
--color-light-pre-school-400: #96a0a8;
--color-light-pre-school-500: #7d8891;
--color-light-pre-school-600: #6a737b;
--color-light-pre-school-700: #545c62;
--color-light-pre-school-800: #3d4348;
--color-light-pre-school-900: #2a2e32;
--color-light-pre-school-950: #181b1e;
}SCSS
$light-pre-school: #c5d0d9;
$light-pre-school-rgb: 197, 208, 217;
$light-pre-school-light: mix(#fff, $light-pre-school, 20%);
$light-pre-school-dark: mix(#000, $light-pre-school, 20%);
.element {
color: $light-pre-school;
box-shadow: 0 0 0 2px rgba($light-pre-school, 0.35);
}