Named color · #EBBC71
Natrolite
Natrolite is #EBBC71: rgb(235 188 113), hsl(37 75% 68%), oklch(0.821 0.108 78.1). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Orange mean? → · Natrolite color name →
#EBBC71
oklch(0.821 0.108 78.1)
Color conversions
- HEX
- #ebbc71
- RGB
- rgb(235 188 113)
- HSL
- hsl(37 75% 68%)
- HWB
- hwb(37 44% 8%)
- OKLCH
- oklch(0.821 0.108 78.1)
- OKLab
- oklab(0.821 0.022 0.105)
- CIE Lab
- lab(79.35 10.97 44.38)
- LCH
- lch(79.35 45.71 76.1)
- CMYK
- cmyk(0% 20% 52% 8%)
Tints · Shades · Tones
Tints
- EDC380
- EFCA8F
- F2D09E
- F4D7AC
- F6DEBA
- F8E5C8
- FAEBD6
- FBF2E4
- FDF8F1
Shades
- CCA361
- AE8B52
- 917343
- 755D35
- 5B4727
- 41321A
- 291F0E
- 130D04
- 030201
Tones
- E0B674
- D5B076
- CAAA79
- BFA47B
- B59E7C
- AA987D
- 9F927E
- 958C7F
- 8A8680
Color harmonies
Complementary +180°
- EBBC71
Natrolite
- A1C7FF
≈ Apocyan
Analogous -30° +30°
- EBBC71
Natrolite
- FEAF86
≈ Spice Pink
- CBCA75
≈ Celery Green
Triadic +120° +240°
- EBBC71
Natrolite
- 61DADE
≈ Pluviophile
- E2AEF2
≈ Candy Dreams
Split-complementary +150° +210°
- EBBC71
Natrolite
- 72D2FC
≈ Heisenberg Blue
- C1BBFF
≈ Dried Lilac
Tetradic +90° +180° +270°
- EBBC71
Natrolite
- 78DBB7
≈ Beryl
- A1C7FF
≈ Apocyan
- F9A8D1
≈ Bazooka Pink
Contrast & accessibility
Ag
FailOn white
WCAG 1.75:1 · APCA Lc 32
Ag
AAAOn black
WCAG 11.96:1 · APCA Lc 71
Best text color: #000000
WCAG 11.96:1 (AAA) · APCA Lc 71
Contrast pairs
Code snippets
CSS
:root {
--natrolite: #ebbc71;
--natrolite-rgb: 235 188 113;
--natrolite-oklch: oklch(0.821 0.108 78.1);
}
.element {
color: var(--natrolite);
background-color: hsl(37 75% 68%);
border-color: oklch(0.821 0.108 78.1);
}Tailwind CSS v4
@theme {
--color-natrolite: #ebbc71;
--color-natrolite-50: #fff3d3;
--color-natrolite-100: #fbe5c0;
--color-natrolite-200: #edd0a0;
--color-natrolite-300: #d4b277;
--color-natrolite-400: #c19650;
--color-natrolite-500: #ad7c20;
--color-natrolite-600: #92691e;
--color-natrolite-700: #755418;
--color-natrolite-800: #573d0f;
--color-natrolite-900: #3d2a0a;
--color-natrolite-950: #271700;
}SCSS
$natrolite: #ebbc71;
$natrolite-rgb: 235, 188, 113;
$natrolite-light: mix(#fff, $natrolite, 20%);
$natrolite-dark: mix(#000, $natrolite, 20%);
.element {
color: $natrolite;
box-shadow: 0 0 0 2px rgba($natrolite, 0.35);
}