Sobre el rosa
Rosa (pink) es un rojo muy claro y vivo con el código hex #ffc0cb, o rgb(255, 192, 203). En HSL tiene un tono de 350°, 100% de saturación y 88% de luminosidad. Es uno de los 148 colores con nombre que entiende cualquier navegador, así que puedes escribir color: pink; en lugar del valor hex.
Uso del rosa en texto y fondos
| Combinación | Ratio de contraste | WCAG |
|---|---|---|
| Texto rosa sobre blanco | 1.54 : 1 | falla |
| Texto rosa sobre negro | 13.65 : 1 | AAA |
Sobre un fondo rosa, usa texto en negro (13.65 : 1). WCAG exige al menos 4.5 : 1 para texto de cuerpo y 3 : 1 para texto grande. Revisa otras combinaciones con el Verificador de contraste.
CSS
.element {
color: pink; /* or #ffc0cb */
background-color: #ffc0cb;
border: 1px solid rgb(255 192 203 / 50%);
}Colores con nombre similares
Rosa claro (#ffb6c1), Durazno (#ffdab9), Bizcocho (#ffe4c4), Trigo (#f5deb3), Cardo (#d8bfd8), Rosa brumosa (#ffe4e1).
Buscador de Nombres de Color
Pega un código HEX para obtener su nombre más cercano y legible, además de nombres de token limpios para tu CSS, SCSS, JavaScript o configuración de Tailwind.