Paleta Firebrick Color Palette

Firebrick Color Palette built around #B22222, a dark warm red anchor (WCAG contrast 3.15:1 against black). The set combines a light tint + a deep shade + a softened complement + a neutral ground. Its strongest pairing is #FAAEA1 on #6A0309 at 7.14:1, which meets WCAG AA for body text.

rojoterrosocálidorústico
#B22222
#FAAEA1
#6A0309
#429292
#BE3F35
#b22222 #faaea1 #6a0309 #429292 #be3f35
#B22222 #FAAEA1 #6A0309 #429292 #BE3F35

Roles semánticos

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

background#FAAEA1
surface#429292
text#6A0309
text-muted#B22222
primary#B22222
secondary#429292
accent#BE3F35

Variables CSS

:root {
  --background: #faaea1;
  --surface: #429292;
  --text: #6a0309;
  --text-muted: #b22222;
  --primary: #b22222;
  --secondary: #429292;
  --accent: #be3f35;
}
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#B22222#FAAEA1#6A0309#429292#BE3F35
#B22222
1.0
3.7
1.9
1.8
1.3
#FAAEA1
3.7
1.0
7.1
2.0
2.9
#6A0309
1.9
7.1
1.0
3.5
2.4
#429292
1.8
2.0
3.5
1.0
1.5
#BE3F35
1.3
2.9
2.4
1.5
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 Firebrick Color Palette en CSS?

Copia las variables CSS de abajo en :root y usa var(--primary), var(--background), etc. Paleta completa: #B22222, #FAAEA1, #6A0309, #429292, #BE3F35.

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

Firebrick Color Palette — #B22222 #FAAEA1 #6A0309 #429292 #BE3F35 — Tintiva