Benoemde kleur · #9DCDE5
Endless Blue
Endless Blue is #9DCDE5: rgb(157 205 229), hsl(200 58% 76%), oklch(0.823 0.06 230). Bekijk tinten, schaduwen, harmonieën, WCAG- en APCA-contrast en CSS-, Tailwind v4- en SCSS-code.
What does Blue mean? → · Endless Blue color name →
#9DCDE5
oklch(0.823 0.06 230)
Kleurconversies
- HEX
- #9dcde5
- RGB
- rgb(157 205 229)
- HSL
- hsl(200 58% 76%)
- HWB
- hwb(200 62% 10%)
- OKLCH
- oklch(0.823 0.06 230)
- OKLab
- oklab(0.823 -0.039 -0.046)
- CIE Lab
- lab(79.62 -12.02 -17.3)
- LCH
- lch(79.62 21.07 235.2)
- CMYK
- cmyk(31% 10% 0% 10%)
Tinten · Schaduwen · Tonen
Tinten
- A7D2E8
- B1D7EA
- BBDCED
- C5E1F0
- CEE6F2
- D8EBF5
- E2F0F7
- ECF5FA
- F5FAFC
Schaduwen
- 88B2C7
- 7398AA
- 5F7E8E
- 4C6672
- 3A4E58
- 28383F
- 182328
- 090F12
- 010203
Tonen
- 9AC5DB
- 98BDD0
- 95B5C6
- 92AEBC
- 8FA6B1
- 8C9EA7
- 89979D
- 868F93
- 83878A
Kleurharmonieën
Complementair +180°
- 9DCDE5
Endless Blue
- E6BAA2
≈ Seasonal Beige
Analoog -30° +30°
- 9DCDE5
Endless Blue
- 96D1D4
≈ Aroma Blue
- AEC6ED
≈ Promise Keeping
Triadisch +120° +240°
- 9DCDE5
Endless Blue
- E4B6CA
≈ Japanese Rose Garden
- C7C99C
≈ Paris Mint
Gesplitst complementair +150° +210°
- 9DCDE5
Endless Blue
- EAB6B5
≈ Summer Cocktails
- DAC199
≈ Natural Twine
Tetradisch +90° +180° +270°
- 9DCDE5
Endless Blue
- D7B9DE
≈ Pretty Petunia
- E6BAA2
≈ Seasonal Beige
- B1CFAA
≈ Gio Ponti Green
Contrast en toegankelijkheid
Ag
FailOp wit
WCAG 1.70:1 · APCA Lc 31
Ag
AAAOp zwart
WCAG 12.29:1 · APCA Lc 72
Beste tekstkleur: #000000
WCAG 12.29:1 (AAA) · APCA Lc 72
Contrast pairs
Codefragmenten
CSS
:root {
--endless-blue: #9dcde5;
--endless-blue-rgb: 157 205 229;
--endless-blue-oklch: oklch(0.823 0.06 230);
}
.element {
color: var(--endless-blue);
background-color: hsl(200 58% 76%);
border-color: oklch(0.823 0.06 230);
}Tailwind CSS v4
@theme {
--color-endless-blue: #9dcde5;
--color-endless-blue-50: #e5f9ff;
--color-endless-blue-100: #d5ecf9;
--color-endless-blue-200: #bbd9ea;
--color-endless-blue-300: #99bed1;
--color-endless-blue-400: #79a6bc;
--color-endless-blue-500: #5b8ea7;
--color-endless-blue-600: #4d788d;
--color-endless-blue-700: #3d6071;
--color-endless-blue-800: #2b4753;
--color-endless-blue-900: #1d313a;
--color-endless-blue-950: #0d1d24;
}SCSS
$endless-blue: #9dcde5;
$endless-blue-rgb: 157, 205, 229;
$endless-blue-light: mix(#fff, $endless-blue, 20%);
$endless-blue-dark: mix(#000, $endless-blue, 20%);
.element {
color: $endless-blue;
box-shadow: 0 0 0 2px rgba($endless-blue, 0.35);
}