Paleta Spring Green Color Palette

Spring Green Color Palette built around #00FF7F, a light neutral green anchor (WCAG contrast 1.35:1 against white). The set combines a light tint + a deep shade + a softened complement + a neutral ground. Its strongest pairing is #B7FFC7 on #00822F at 4.28:1, which does NOT meet WCAG AA (4.5:1) for body text — use it for large text or non-text UI only.

verdefrescobrillantefrío
#00FF7F
#B7FFC7
#00822F
#C63980
#18DD6F
#00ff7f #b7ffc7 #00822f #c63980 #18dd6f
#00FF7F #B7FFC7 #00822F #C63980 #18DD6F

Roles semánticos

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

background#B7FFC7
surface#00FF7F
text#00822F
text-muted#C63980
primary#00FF7F
secondary#C63980
accent#18DD6F

Variables CSS

:root {
  --background: #b7ffc7;
  --surface: #00ff7f;
  --text: #00822f;
  --text-muted: #c63980;
  --primary: #00ff7f;
  --secondary: #c63980;
  --accent: #18dd6f;
}
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#00FF7F#B7FFC7#00822F#C63980#18DD6F
#00FF7F
1.0
1.2
3.7
3.6
1.3
#B7FFC7
1.2
1.0
4.3
4.2
1.6
#00822F
3.7
4.3
1.0
1.0
2.7
#C63980
3.6
4.2
1.0
1.0
2.7
#18DD6F
1.3
1.6
2.7
2.7
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

Paletas similares

Preguntas frecuentes

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

Copia las variables CSS de abajo en :root y usa var(--primary), var(--background), etc. Paleta completa: #00FF7F, #B7FFC7, #00822F, #C63980, #18DD6F.

¿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.

Spring Green Color Palette — #00FF7F #B7FFC7 #00822F #C63980 #18DD6F — Tintiva