Benoemde kleur · #B5C2CD
Pre School
Pre School is #B5C2CD: rgb(181 194 205), hsl(208 19% 76%), oklch(0.807 0.021 243.5). Bekijk tinten, schaduwen, harmonieën, WCAG- en APCA-contrast en CSS-, Tailwind v4- en SCSS-code.
What does Gray mean? → · Pre School color name →
#B5C2CD
oklch(0.807 0.021 243.5)
Kleurconversies
- HEX
- #b5c2cd
- RGB
- rgb(181 194 205)
- HSL
- hsl(208 19% 76%)
- HWB
- hwb(208 71% 20%)
- OKLCH
- oklch(0.807 0.021 243.5)
- OKLab
- oklab(0.807 -0.009 -0.019)
- CIE Lab
- lab(77.67 -2.97 -7.15)
- LCH
- lch(77.67 7.74 247.4)
- CMYK
- cmyk(12% 5% 0% 20%)
Tinten · Schaduwen · Tonen
Tinten
- BCC8D2
- C3CED7
- CBD4DC
- D2DAE1
- D9E0E6
- E1E6EB
- E8ECF0
- F0F3F5
- F7F9FA
Schaduwen
- 9DA8B2
- 868F98
- 6F777E
- 596066
- 44494E
- 303438
- 1D2023
- 0C0E0F
- 020202
Tonen
- B0BBC5
- AAB4BD
- A5AEB5
- 9FA7AD
- 9AA0A6
- 959A9E
- 909396
- 8A8D8F
- 858687
Kleurharmonieën
Complementair +180°
- B5C2CD
Pre School
- CABEB2
≈ Penthouse View
Analoog -30° +30°
- B5C2CD
Pre School
- B1C4C8
≈ Yín Sè Silver
- BBBFCE
≈ Mount Nirvana
Triadisch +120° +240°
- B5C2CD
Pre School
- CDBBBE
≈ Lady Fingers
- BDC3B4
≈ Seaside Fog
Gesplitst complementair +150° +210°
- B5C2CD
Pre School
- CDBCB7
≈ Barely Mauve
- C4C0B1
≈ Biking Trail
Tetradisch +90° +180° +270°
- B5C2CD
Pre School
- C9BBC6
≈ Queen’s Violet
- CABEB2
≈ Penthouse View
- B6C4BA
≈ Median Green
Contrast en toegankelijkheid
Ag
FailOp wit
WCAG 1.81:1 · APCA Lc 34
Ag
AAAOp zwart
WCAG 11.56:1 · APCA Lc 69
Beste tekstkleur: #000000
WCAG 11.56:1 (AAA) · APCA Lc 69
Contrast pairs
Codefragmenten
CSS
:root {
--pre-school: #b5c2cd;
--pre-school-rgb: 181 194 205;
--pre-school-oklch: oklch(0.807 0.021 243.5);
}
.element {
color: var(--pre-school);
background-color: hsl(208 19% 76%);
border-color: oklch(0.807 0.021 243.5);
}Tailwind CSS v4
@theme {
--color-pre-school: #b5c2cd;
--color-pre-school-50: #f0f6fb;
--color-pre-school-100: #e2e9ef;
--color-pre-school-200: #cdd5dd;
--color-pre-school-300: #afb9c2;
--color-pre-school-400: #94a0aa;
--color-pre-school-500: #7b8893;
--color-pre-school-600: #68737d;
--color-pre-school-700: #535c64;
--color-pre-school-800: #3c4349;
--color-pre-school-900: #292f33;
--color-pre-school-950: #171b1e;
}SCSS
$pre-school: #b5c2cd;
$pre-school-rgb: 181, 194, 205;
$pre-school-light: mix(#fff, $pre-school, 20%);
$pre-school-dark: mix(#000, $pre-school, 20%);
.element {
color: $pre-school;
box-shadow: 0 0 0 2px rgba($pre-school, 0.35);
}