Paleta Paleturquoise Color Palette

Paleturquoise Color Palette built around #AFEEEE, a light cool cyan anchor (WCAG contrast 1.29:1 against white). The set combines a light tint + a deep shade + a softened complement + a neutral ground. Its strongest pairing is #DEFAFA on #4D7878 at 4.48:1, which does NOT meet WCAG AA (4.5:1) for body text — use it for large text or non-text UI only.

cianclaromoderadofrío
#AFEEEE
#DEFAFA
#4D7878
#E0BDBD
#98CECE
#afeeee #defafa #4d7878 #e0bdbd #98cece
#AFEEEE #DEFAFA #4D7878 #E0BDBD #98CECE

Roles semánticos

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

background#DEFAFA
surface#AFEEEE
text#4D7878
text-muted#98CECE
primary#AFEEEE
secondary#E0BDBD
accent#98CECE

Variables CSS

:root {
  --background: #defafa;
  --surface: #afeeee;
  --text: #4d7878;
  --text-muted: #98cece;
  --primary: #afeeee;
  --secondary: #e0bdbd;
  --accent: #98cece;
}
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#AFEEEE#DEFAFA#4D7878#E0BDBD#98CECE
#AFEEEE
1.0
1.2
3.8
1.3
1.4
#DEFAFA
1.2
1.0
4.5
1.6
1.6
#4D7878
3.8
4.5
1.0
2.9
2.8
#E0BDBD
1.3
1.6
2.9
1.0
1.0
#98CECE
1.4
1.6
2.8
1.0
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 Paleturquoise Color Palette en CSS?

Copia las variables CSS de abajo en :root y usa var(--primary), var(--background), etc. Paleta completa: #AFEEEE, #DEFAFA, #4D7878, #E0BDBD, #98CECE.

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

Paleturquoise Color Palette — #AFEEEE #DEFAFA #4D7878 #E0BDBD #98CECE — Tintiva