Color Blanco roto: código #FAF9F6

Blanco roto

#FAF9F6

Códigos del color

  • HEX#FAF9F6
  • RGBrgb(250, 249, 246)
  • HSLhsl(45, 29%, 97%)
  • HSVhsv(45, 2%, 98%)
  • CMYKcmyk(0%, 0%, 2%, 2%)
  • LABlab(97.9% -0.2 1.6)
  • OKLCHoklch(98.2% 0.004 91.5)

Sobre el color Blanco roto

Blanco roto tiene el código HEX #FAF9F6, que corresponde a rgb(250, 249, 246) en el modelo RGB. En el círculo cromático, su tono está en 45°, con 29% de saturación y 97% de luminosidad (hsl(45, 29%, 97%)).

Con una saturación muy baja (o una luminosidad extrema) funciona como color neutro, fácil de combinar con casi cualquier otro.

Como fondo pide texto oscuro: el negro alcanza un contraste de 19,94:1 sobre él, frente a 1,05:1 del blanco.

Para impresión, la conversión aproximada es cmyk(0%, 0%, 2%, 2%). Confírmala siempre con el perfil de color de la imprenta, porque el resultado depende del papel y la tinta.

Tonos más claros

Tonos más oscuros

Combinaciones con Blanco roto

Complementaria

#FAF9F6 · #F5F6FA

Análoga

#FAF6F5 · #FAF9F6 · #F8FAF5

Tríada

#FAF9F6 · #F5FAF8 · #F8F5FA

Tetrádica

#FAF9F6 · #F5FAF6 · #F5F6FA · #FAF5F8

Complementaria dividida

#FAF9F6 · #F5F8FA · #F6F5FA

Monocromática

#CCC2A3 · #E7E3D4 · #FAF9F6 · #FFFFFF · #FFFFFF

Blanco roto con texto blanco y negro

Texto blanco Aa Bb Cc 123
1,05:1 · no cumple WCAG
Texto negro Aa Bb Cc 123
19,94:1 · AAA

Prueba otras combinaciones en el verificador de contraste

Un blanco que no es del todo blanco

El blanco roto (en inglés, off-white) es cualquier blanco ligeramente “desviado” del blanco puro, con una pizca de otro color. El tono de esta página, #FAF9F6 (rgb(250, 249, 246)), tiene un poco menos de azul que de rojo, lo que lo vuelve sutilmente cálido. La diferencia numérica con el blanco es pequeña, pero se nota al ponerlos lado a lado, sobre todo en pantallas grandes. A diferencia de beige o ivory, el blanco roto no es un color con nombre en CSS: cada marca, fabricante de pintura o diseñador define el suyo.

Blanco roto, crema, beige y marfil lado a lado

ColorHEXRGBCarácter
Blanco#FFFFFF255, 255, 255neutro, brillo máximo
Blanco roto#FAF9F6250, 249, 246casi blanco, levemente cálido
Marfil (ivory)#FFFFF0255, 255, 240blanco amarillento muy sutil
Crema#FFFDD0255, 253, 208amarillo pálido evidente
Beige#F5F5DC245, 245, 220más oscuro, verdoso

Dónde usarlo

En la web, el blanco roto es un fondo habitual en sitios editoriales, blogs y portafolios: suaviza el brillo del blanco puro y da sensación de papel sin parecer sucio. En identidad visual, ofrece una base más refinada para logotipos oscuros. En decoración, es el “blanco” que la mayoría de las marcas de pintura venden como neutro cálido, porque el blanco absoluto puede resultar frío y clínico en espacios con poca luz natural. En moda, las prendas en blanco roto suelen verse más caras y combinan con casi todo.

Algunas combinaciones seguras: gris marengo (#36454F) para el texto, verde esmeralda (#50C878) como acento, vino (#722F37) para títulos y nude (#E3BC9A) en bloques secundarios.

Consejo: contraste y modo oscuro

El texto sobre blanco roto sigue las mismas reglas que sobre blanco: usa colores oscuros, nunca texto blanco (el contraste es de 1,05:1). El negro puro sobre #FAF9F6 llega casi a 20:1; muchos diseñadores prefieren un gris oscuro para suavizarlo. Para separar tarjetas blancas de un fondo en blanco roto, la diferencia es tan leve que un borde fino ayuda. En modo oscuro, el blanco roto pasa a ser el color del texto sobre fondos grafito, con menos brillo que el blanco puro. Pruébalo en el verificador de contraste y lee más sobre fondos en la guía de paleta de colores para sitios web.

Cómo usarlo en CSS

:root {
  --color-off-white: #FAF9F6;
  --color-off-white-rgb: 250, 249, 246;
}

.elemento {
  background-color: var(--color-off-white);
  color: #000000;
}

Colores parecidos

Usa Blanco roto en nuestras herramientas