Paleta Forest Color Palette

Cinco pasos de dosel verde, del pino profundo a la hoja pálida. Natural, serena y orgánica.

bosqueverdenatural
#1E3F20
#2F5D34
#4E7A4E
#7FA97F
#C8D9B8
#1e3f20 #2f5d34 #4e7a4e #7fa97f #c8d9b8
#1E3F20 #2F5D34 #4E7A4E #7FA97F #C8D9B8

Roles semánticos

Asignados de forma determinista: el más claro = fondo, el más oscuro = texto, el más saturado = primario.

background#C8D9B8
surface#7FA97F
text#1E3F20
text-muted#2F5D34
primary#2F5D34
secondary#4E7A4E
accent#7FA97F

Variables CSS 

:root {
  --background: #c8d9b8;
  --surface: #7fa97f;
  --text: #1e3f20;
  --text-muted: #2f5d34;
  --primary: #2f5d34;
  --secondary: #4e7a4e;
  --accent: #7fa97f;
}
Vista previa en interfaces →

Matriz de accesibilidad

Color del texto (filas) sobre el fondo (columnas). Verde = cumple WCAG AA para texto normal (≥4.5:1).

Texto \ Fondo#1E3F20#2F5D34#4E7A4E#7FA97F#C8D9B8
#1E3F20
1.0
1.5
2.4
4.4
7.9
#2F5D34
1.5
1.0
1.5
2.9
5.1
#4E7A4E
2.4
1.5
1.0
1.9
3.3
#7FA97F
4.4
2.9
1.9
1.0
1.8
#C8D9B8
7.9
5.1
3.3
1.8
1.0

Bajo deuteranopía

Simulación de Machado et al. (2009), severidad 1.0 — aproximación, no es una herramienta médica.

Colores de esta paleta

#1E3F20
rgb(30, 63, 32)
#2F5D34
rgb(47, 93, 52)
#4E7A4E
rgb(78, 122, 78)
#7FA97F
rgb(127, 169, 127)
#C8D9B8
rgb(200, 217, 184)

Paletas similares

Fern Color Palette
Forest Green Color Palette
Moss Green Color Palette

Preguntas frecuentes

¿Cómo uso la paleta Forest Color Palette en CSS?

Copia las variables CSS de abajo en :root y usa var(--primary), var(--background), etc. Paleta completa: #1E3F20, #2F5D34, #4E7A4E, #7FA97F, #C8D9B8.

¿Estos colores pasan las comprobaciones de accesibilidad?

Consulta la matriz WCAG de esta página: cada combinación texto-sobre-fondo con ratio ≥ 4.5 cumple AA para texto normal; ≥ 3 cumple AA para texto grande y componentes de interfaz.

Forest Color Palette — #1E3F20 #2F5D34 #4E7A4E #7FA97F #C8D9B8 — Tintiva