Color con nombre · #284C3C
Springbok Green
Springbok Green es #284C3C: rgb(40 76 60), hsl(153 31% 23%), oklch(0.384 0.05 163.7). Mira tintes, sombras, armonías, contraste WCAG y APCA, y código CSS, Tailwind v4 y SCSS.
What does Green mean? → · Springbok Green color name →
#284C3C
oklch(0.384 0.05 163.7)
Conversiones de color
- HEX
- #284c3c
- RGB
- rgb(40 76 60)
- HSL
- hsl(153 31% 23%)
- HWB
- hwb(153 16% 70%)
- OKLCH
- oklch(0.384 0.05 163.7)
- OKLab
- oklab(0.384 -0.048 0.014)
- CIE Lab
- lab(29.23 -16.88 5.31)
- LCH
- lch(29.23 17.7 162.5)
- CMYK
- cmyk(47% 0% 21% 70%)
Tintes · Sombras · Tonos
Tintes
- 3C5C4D
- 506D5F
- 647E71
- 798F84
- 8EA198
- A4B3AC
- BAC6C0
- D1D9D4
- E8ECEA
Sombras
- 214133
- 1B362A
- 152C21
- 0F2219
- 091811
- 040F0A
- 020604
- 010201
- 000000
Tonos
- 315142
- 3A5649
- 435B50
- 4C6156
- 54665D
- 5D6B64
- 66706B
- 6E7572
- 777B79
Armonías de color
Complementario +180°
- 284C3C
Springbok Green
- 57394A
≈ Purple Sphinx
Análogo -30° +30°
- 284C3C
Springbok Green
- 38492D
≈ Palm Leaf
- 1D4C4B
≈ Nighthawks
Triádico +120° +240°
- 284C3C
Springbok Green
- 40405E
≈ Church Blue
- 5A3B2D
≈ Cioccolato
Complementario dividido +150° +210°
- 284C3C
Springbok Green
- 4D3B57
≈ Purple Velvet
- 5B383B
≈ Warmed Wine
Tetrádico +90° +180° +270°
- 284C3C
Springbok Green
- 30455E
≈ Moonlit Ocean
- 57394A
≈ Purple Sphinx
- 543F24
≈ Clove Yellow Brown
Contraste y accesibilidad
Ag
AAASobre blanco
WCAG 9.59:1 · APCA Lc 92
Ag
FailSobre negro
WCAG 2.18:1 · APCA Lc 10
Mejor color de texto: #FFFFFF
WCAG 9.59:1 (AAA) · APCA Lc 92
Contrast pairs
Fragmentos de código
CSS
:root {
--springbok-green: #284c3c;
--springbok-green-rgb: 40 76 60;
--springbok-green-oklch: oklch(0.384 0.05 163.7);
}
.element {
color: var(--springbok-green);
background-color: hsl(153 31% 23%);
border-color: oklch(0.384 0.05 163.7);
}Tailwind CSS v4
@theme {
--color-springbok-green: #284c3c;
--color-springbok-green-50: #e9faf2;
--color-springbok-green-100: #d9eee4;
--color-springbok-green-200: #c1dbcf;
--color-springbok-green-300: #a0c0b1;
--color-springbok-green-400: #84a896;
--color-springbok-green-500: #67917d;
--color-springbok-green-600: #587b6a;
--color-springbok-green-700: #466255;
--color-springbok-green-800: #33483d;
--color-springbok-green-900: #22322a;
--color-springbok-green-950: #111e17;
}SCSS
$springbok-green: #284c3c;
$springbok-green-rgb: 40, 76, 60;
$springbok-green-light: mix(#fff, $springbok-green, 20%);
$springbok-green-dark: mix(#000, $springbok-green, 20%);
.element {
color: $springbok-green;
box-shadow: 0 0 0 2px rgba($springbok-green, 0.35);
}