Benoemde kleur · #9BDCB9
Birthday King
Birthday King is #9BDCB9: rgb(155 220 185), hsl(148 48% 74%), oklch(0.841 0.082 160.4). Bekijk tinten, schaduwen, harmonieën, WCAG- en APCA-contrast en CSS-, Tailwind v4- en SCSS-code.
What does Green mean? → · Birthday King color name →
#9BDCB9
oklch(0.841 0.082 160.4)
Kleurconversies
- HEX
- #9bdcb9
- RGB
- rgb(155 220 185)
- HSL
- hsl(148 48% 74%)
- HWB
- hwb(148 61% 14%)
- OKLCH
- oklch(0.841 0.082 160.4)
- OKLab
- oklab(0.841 -0.078 0.028)
- CIE Lab
- lab(82.67 -26.85 10.37)
- LCH
- lch(82.67 28.78 158.9)
- CMYK
- cmyk(30% 0% 16% 14%)
Tinten · Schaduwen · Tonen
Tinten
- A6E0C0
- B0E3C7
- BAE7CE
- C4EAD5
- CEEEDC
- D8F1E3
- E2F5EA
- ECF8F1
- F5FCF8
Schaduwen
- 86BFA0
- 72A389
- 5E8871
- 4B6E5B
- 395446
- 283C31
- 18261E
- 09110D
- 010202
Tonen
- 99D2B3
- 97C9AD
- 94C0A8
- 92B6A2
- 8FAD9C
- 8CA496
- 899B91
- 86928B
- 838986
Kleurharmonieën
Complementair +180°
- 9BDCB9
Birthday King
- F0B6DB
≈ Soft Cashmere
Analoog -30° +30°
- 9BDCB9
Birthday King
- B9D69E
≈ In Good Taste
- 89DDD7
≈ Limpet Shell
Triadisch +120° +240°
- 9BDCB9
Birthday King
- C0C6FF
≈ Light Periwinkle
- FAB9A2
≈ Pallid Orange
Gesplitst complementair +150° +210°
- 9BDCB9
Birthday King
- DCBCF3
≈ Beefy Pink
- FBB5BE
≈ Matt Pink
Tetradisch +90° +180° +270°
- 9BDCB9
Birthday King
- A3CFFF
≈ Baby Blue
- F0B6DB
≈ Soft Cashmere
- EEC290
≈ Harvester
Contrast en toegankelijkheid
Ag
FailOp wit
WCAG 1.57:1 · APCA Lc 26
Ag
AAAOp zwart
WCAG 13.33:1 · APCA Lc 77
Beste tekstkleur: #000000
WCAG 13.33:1 (AAA) · APCA Lc 77
Contrast pairs
Codefragmenten
CSS
:root {
--birthday-king: #9bdcb9;
--birthday-king-rgb: 155 220 185;
--birthday-king-oklch: oklch(0.841 0.082 160.4);
}
.element {
color: var(--birthday-king);
background-color: hsl(148 48% 74%);
border-color: oklch(0.841 0.082 160.4);
}Tailwind CSS v4
@theme {
--color-birthday-king: #9bdcb9;
--color-birthday-king-50: #e1fdee;
--color-birthday-king-100: #d0f1e0;
--color-birthday-king-200: #b6e0ca;
--color-birthday-king-300: #91c5ab;
--color-birthday-king-400: #72ae8e;
--color-birthday-king-500: #509774;
--color-birthday-king-600: #458062;
--color-birthday-king-700: #37664e;
--color-birthday-king-800: #284b38;
--color-birthday-king-900: #1b3426;
--color-birthday-king-950: #0b1f14;
}SCSS
$birthday-king: #9bdcb9;
$birthday-king-rgb: 155, 220, 185;
$birthday-king-light: mix(#fff, $birthday-king, 20%);
$birthday-king-dark: mix(#000, $birthday-king, 20%);
.element {
color: $birthday-king;
box-shadow: 0 0 0 2px rgba($birthday-king, 0.35);
}