Color con nombre · #5F8748
Beatnik
Beatnik es #5F8748: rgb(95 135 72), hsl(98 30% 41%), oklch(0.578 0.101 135). Mira tintes, sombras, armonías, contraste WCAG y APCA, y código CSS, Tailwind v4 y SCSS.
What does Green mean? → · Beatnik color name →
#5F8748
oklch(0.578 0.101 135)
Conversiones de color
- HEX
- #5f8748
- RGB
- rgb(95 135 72)
- HSL
- hsl(98 30% 41%)
- HWB
- hwb(98 28% 47%)
- OKLCH
- oklch(0.578 0.101 135)
- OKLab
- oklab(0.578 -0.072 0.071)
- CIE Lab
- lab(52.18 -23.51 29.1)
- LCH
- lch(52.18 37.41 128.9)
- CMYK
- cmyk(30% 0% 47% 47%)
Tintes · Sombras · Tonos
Tintes
- 6E935A
- 7D9E6C
- 8DAA7E
- 9DB690
- ADC2A2
- BDCEB4
- CDDAC6
- DDE6D9
- EEF3EC
Sombras
- 52753D
- 446333
- 385129
- 2C411F
- 203116
- 15210D
- 0A1306
- 030602
- 000100
Tonos
- 63864E
- 668655
- 69855B
- 6D8560
- 708466
- 73836B
- 778371
- 7A8276
- 7D817B
Armonías de color
Complementario +180°
- 5F8748
Beatnik
- 9067A3
≈ Empire Violet
Análogo -30° +30°
- 5F8748
Beatnik
- 837D2D
≈ Verdant
- 318C6B
≈ Leprechaun
Triádico +120° +240°
- 5F8748
Beatnik
- 4F7CB4
≈ Endless River
- AD5F66
≈ Redbud
Complementario dividido +150° +210°
- 5F8748
Beatnik
- 7470B3
≈ Clear Mauve
- A46087
≈ Wild Mulberry
Tetrádico +90° +180° +270°
Contraste y accesibilidad
Ag
FailSobre blanco
WCAG 4.16:1 · APCA Lc 69
Ag
AASobre negro
WCAG 5.04:1 · APCA Lc 33
Mejor color de texto: #000000
WCAG 5.04:1 (AA) · APCA Lc 33
Contrast pairs
Fragmentos de código
CSS
:root {
--beatnik: #5f8748;
--beatnik-rgb: 95 135 72;
--beatnik-oklch: oklch(0.578 0.101 135);
}
.element {
color: var(--beatnik);
background-color: hsl(98 30% 41%);
border-color: oklch(0.578 0.101 135);
}Tailwind CSS v4
@theme {
--color-beatnik: #5f8748;
--color-beatnik-50: #e8fce0;
--color-beatnik-100: #d9f0cf;
--color-beatnik-200: #c0dfb5;
--color-beatnik-300: #9fc491;
--color-beatnik-400: #84ac6f;
--color-beatnik-500: #68954e;
--color-beatnik-600: #587e43;
--color-beatnik-700: #476535;
--color-beatnik-800: #344a24;
--color-beatnik-900: #243318;
--color-beatnik-950: #121f09;
}SCSS
$beatnik: #5f8748;
$beatnik-rgb: 95, 135, 72;
$beatnik-light: mix(#fff, $beatnik, 20%);
$beatnik-dark: mix(#000, $beatnik, 20%);
.element {
color: $beatnik;
box-shadow: 0 0 0 2px rgba($beatnik, 0.35);
}