Color Coral: código #FF7F50

Coral

#FF7F50

Códigos del color

  • HEX#FF7F50
  • RGBrgb(255, 127, 80)
  • HSLhsl(16, 100%, 66%)
  • HSVhsv(16, 69%, 100%)
  • CMYKcmyk(0%, 50%, 69%, 0%)
  • LABlab(67.3% 45.4 47.5)
  • OKLCHoklch(73.5% 0.168 40.3)

Sobre el color Coral

Coral tiene el código HEX #FF7F50, que corresponde a rgb(255, 127, 80) en el modelo RGB. En el círculo cromático, su tono está en 16°, con 100% de saturación y 66% de luminosidad (hsl(16, 100%, 66%)).

Por su tono se percibe como un color cálido: suele transmitir energía y cercanía y «avanza» visualmente en la composición.

Como fondo pide texto oscuro: el negro alcanza un contraste de 8,40:1 sobre él, frente a 2,49:1 del blanco.

Para impresión, la conversión aproximada es cmyk(0%, 50%, 69%, 0%). 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 Coral

Complementaria

#FF7F50 · #52D1FF

Análoga

#FF527A · #FF7F50 · #FFD752

Tríada

#FF7F50 · #52FF80 · #8052FF

Tetrádica

#FF7F50 · #7AFF52 · #52D1FF · #D752FF

Complementaria dividida

#FF7F50 · #52FFD7 · #527AFF

Monocromática

#D13800 · #FF5A1F · #FF7F50 · #FFB89E · #FFF0EB

Coral con texto blanco y negro

Texto blanco Aa Bb Cc 123
2,49:1 · no cumple WCAG
Texto negro Aa Bb Cc 123
8,40:1 · AAA

Prueba otras combinaciones en el verificador de contraste

El coral (#FF7F50, rgb(255, 127, 80)) es un naranja rosado, luminoso y cálido, bautizado por los corales marinos. También es un color con nombre en CSS: color: coral; produce exactamente este tono. En 2019, una variante cercana, el Pantone 16-1546 Living Coral, fue elegida Color del Año por Pantone, lo que ayudó a popularizarlo en moda, decoración e interfaces.

Lectura y asociaciones

El coral suele percibirse como alegre, sociable y acogedor, con un pie en el verano y la playa. Tiene la energía del naranja suavizada por el rosa, lo que lo hace menos agresivo que el rojo y más maduro que el rosa claro. En contextos de conservación ambiental, también evoca los arrecifes y su fragilidad. Son lecturas habituales en Occidente, no reglas: el significado final depende del público y de lo que acompañe al color.

Coral vs. salmón

Son vecinos en el círculo cromático, pero no gemelos. El coral tiene más naranja y menos azul (B = 80); el salmón (#FA8072) tiene más azul (B = 114), lo que lo vuelve más rosado y algo más suave. En la práctica, el coral enciende una composición y el salmón la calienta con delicadeza. Ambos tienen casi la misma luminancia, así que su contraste con blanco y negro es prácticamente idéntico.

Aplicaciones

En UI, el coral funciona bien en botones de acción secundaria, ilustraciones y estados destacados, sobre todo en apps de estilo de vida, viajes y comida. En trajes de baño y ropa de verano favorece a las pieles bronceadas y morenas. En decoración aparece en cojines, vajilla y láminas sin necesidad de cubrir una pared entera.

Combinaciones que funcionan: turquesa (#40E0D0), el dúo tropical clásico; azul marino (#000080), para un aire náutico; blanco roto (#FAF9F6), que aporta ligereza; y mostaza (#FFDB58), para una paleta retro.

Consejo de accesibilidad

El texto blanco sobre coral tiene un contraste de apenas 2,5:1, por debajo incluso del mínimo para texto grande. Usa texto oscuro (8,4:1 con negro) o, si la marca exige texto blanco, oscurece el fondo hasta algo como #B8481F, que supera 5:1. Pruébalo en el verificador de contraste.

Cómo usarlo en CSS

:root {
  --color-coral: #FF7F50;
  --color-coral-rgb: 255, 127, 80;
}

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

Colores parecidos

Usa Coral en nuestras herramientas