#5FB16E#5FB16E
#5FB16E es un color claro y vivo de la familia verde. Luminancia relativa 0.350; OKLCH L 69.1% C 0.127 H 148.3°. El mejor color de texto es #000000 con contraste 8.00:1 (cumple WCAG AA).
Valores del color
| HEX | #5FB16E |
|---|---|
| RGB | rgb(95, 177, 110) |
| HSL | hsl(131, 34%, 53%) |
| HSV | hsv(131, 46%, 69%) |
| CMYK | cmyk(46.3%, 0%, 37.9%, 30.6%) |
| CIE-LAB | lab(65.75, -39.65, 26.73) |
| CIE-LCH | lch(65.75, 47.82, 146.01°) |
| OKLab | oklab(69.1% -0.1078 0.0666) |
| OKLCH | oklch(69.1% 0.127 148.3) |
| XYZ | xyz(23.2545, 35.0013, 20.2794) |
| Luminance | 0.3500 (WCAG relative) |
| Temperature | neutral |
| Family | green |
Colores con nombre más cercanos
Algae
#54AC68
ΔE00 1.85
Fern
#63B76C
ΔE00 2.17
Boring Green
#63B365
ΔE00 2.34
Mediumseagreen
#3CB371
ΔE00 3.68
Dark Pastel Green
#56AE57
ΔE00 3.96
Faded Green
#7BB274
ΔE00 4.03
Escalas perceptuales
Sombras
Matices
Tonos
OKLCH scale
Armonías de color
complementary
#5FB16E #B15FA2
analogous
#79B15F #5FB16E #5FB197
triadic
#5FB16E #6E5FB1 #B16E5F
tetradic
#5FB16E #5F79B1 #B15FA2 #B1975F
square
#5FB16E #5F79B1 #B15FA2 #B1975F
split-complementary
#5FB16E #975FB1 #B15F79
monochromatic
#31653A #458E52 #5FB16E #88C593 #B1D9B9
Accesibilidad y contraste
On white
2.62
#5FB16E on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
8.00
#5FB16E on #000000
AA ✓AA large ✓AAA ✓
Mejor color de texto
#000000 on #5FB16E
8.00:1 — WCAG AA (texto normal) cumple
Matriz de contraste
| fg \ bg | ##5FB16E | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##5FB16E | 1.00 | 2.62 | 8.00 | 8.00 |
| #FFFFFF | 2.62 | 1.00 | 21.00 | 21.00 |
| #000000 | 8.00 | 21.00 | 1.00 | 1.00 |
| ##000000 | 8.00 | 21.00 | 1.00 | 1.00 |
Vista previa de daltonismo
Protanopia (red-blind)
#B3A569
Deuteranopia (green-blind)
#A79D72
Tritanopia (blue-blind)
#51AEA0
Achromatopsia (no color)
#A0A0A0
Tokens de diseño y código
CSS
--color: #5fb16e; /* rgb */ color: rgb(95, 177, 110); /* oklch */ color: oklch(69.1% 0.127 148.3);
Tailwind
colors: {
custom: {
50: '#91c998',
500: '#5fb16e',
950: '#000000',
},
}SCSS
$custom: #5fb16e; $custom-light: #91c998; $custom-dark: #000000;
JSON
{
"hex": "#5fb16e",
"rgb": {
"r": 95,
"g": 177,
"b": 110
},
"hsl": {
"h": 130.976,
"s": 34.454,
"l": 53.333
},
"oklch": {
"l": 0.69101,
"c": 0.1267,
"h": 148.3
},
"luminance": 0.35003
}Semantic roles & 50–950 ramp
primary
#5FB16E
secondary
#C8A4C1
accent
#5DB7CB
background
#F9FCF9
surface
#F1F8F2
border
#CBD1CC
text
#0D130D
muted
#7E827E
Laboratorio de vista previa
Laboratorio de vista previa → · Comprobador de contraste → · Generador de paletas →