Benoemde kleur · #AADEB2
Celtic Spring
Celtic Spring is #AADEB2: rgb(170 222 178), hsl(129 44% 77%), oklch(0.853 0.081 149). Bekijk tinten, schaduwen, harmonieën, WCAG- en APCA-contrast en CSS-, Tailwind v4- en SCSS-code.
What does Green mean? → · Celtic Spring color name →
#AADEB2
oklch(0.853 0.081 149)
Kleurconversies
- HEX
- #aadeb2
- RGB
- rgb(170 222 178)
- HSL
- hsl(129 44% 77%)
- HWB
- hwb(129 67% 13%)
- OKLCH
- oklch(0.853 0.081 149)
- OKLab
- oklab(0.853 -0.07 0.042)
- CIE Lab
- lab(83.97 -23.85 15.98)
- LCH
- lch(83.97 28.71 146.2)
- CMYK
- cmyk(23% 0% 20% 13%)
Tinten · Schaduwen · Tonen
Tinten
- B3E1BA
- BBE5C1
- C4E8C9
- CCEBD1
- D5EFD8
- DDF2E0
- E6F5E8
- EEF9EF
- F7FCF7
Schaduwen
- 93C19A
- 7DA583
- 68896D
- 536F57
- 3F5543
- 2D3D2F
- 1B261D
- 0B120C
- 010201
Tonen
- A6D4AD
- A2CBA8
- 9EC1A3
- 9AB89E
- 96AE99
- 91A594
- 8D9B8F
- 89928A
- 848985
Kleurharmonieën
Complementair +180°
- AADEB2
Celtic Spring
- EDBCE9
≈ Lovecloud
Analoog -30° +30°
- AADEB2
Celtic Spring
- C8D79A
≈ Cucumber Ice
- 92E1D0
≈ Beach Glass
Triadisch +120° +240°
- AADEB2
Celtic Spring
- BBCDFF
≈ Ice Cold Stare
- FFBBB1
≈ Petula
Gesplitst complementair +150° +210°
- AADEB2
Celtic Spring
- D6C3FD
≈ Innocent Snowdrop
- FCB9CD
≈ Tentacle Pink
Tetradisch +90° +180° +270°
- AADEB2
Celtic Spring
- 9DD7FE
≈ Shiva Blue
- EDBCE9
≈ Lovecloud
- F7C29A
≈ Cream Blush
Contrast en toegankelijkheid
Ag
FailOp wit
WCAG 1.52:1 · APCA Lc 24
Ag
AAAOp zwart
WCAG 13.80:1 · APCA Lc 79
Beste tekstkleur: #000000
WCAG 13.80:1 (AAA) · APCA Lc 79
Contrast pairs
Codefragmenten
CSS
:root {
--celtic-spring: #aadeb2;
--celtic-spring-rgb: 170 222 178;
--celtic-spring-oklch: oklch(0.853 0.081 149);
}
.element {
color: var(--celtic-spring);
background-color: hsl(129 44% 77%);
border-color: oklch(0.853 0.081 149);
}Tailwind CSS v4
@theme {
--color-celtic-spring: #aadeb2;
--color-celtic-spring-50: #e5fcea;
--color-celtic-spring-100: #d5f0da;
--color-celtic-spring-200: #bcdfc3;
--color-celtic-spring-300: #9ac4a3;
--color-celtic-spring-400: #7dac84;
--color-celtic-spring-500: #5e9568;
--color-celtic-spring-600: #507e59;
--color-celtic-spring-700: #406547;
--color-celtic-spring-800: #2f4a32;
--color-celtic-spring-900: #203322;
--color-celtic-spring-950: #0f1f11;
}SCSS
$celtic-spring: #aadeb2;
$celtic-spring-rgb: 170, 222, 178;
$celtic-spring-light: mix(#fff, $celtic-spring, 20%);
$celtic-spring-dark: mix(#000, $celtic-spring, 20%);
.element {
color: $celtic-spring;
box-shadow: 0 0 0 2px rgba($celtic-spring, 0.35);
}