Coral es un color vibrante y cálido que mezcla elementos de rosa y naranja. Se sitúa entre naranja y rojo en el círculo cromático, dándole un toque juguetón y acogedor. Este tono es más suave que un naranja típico, añadiendo una cualidad delicada a su carácter.
Coral se define por los siguientes códigos y valores de color para asegurar la consistencia en diversas plataformas y dispositivos digitales.
- Código HEX: #FF8559
- Valor RGB: 100% rojo, 52.2% verde, y 34.9% azul
Aquí hay algunas maneras de usar coral en tus diseños:
- Invocar sensaciones tropicales. Coral es perfecto para diseños que buscan evocar una sensación de verano o ambiente tropical. Úsalo para fondos o acentos para crear una atmósfera playera y relajante.
- Dirigir la atención del usuario. La naturaleza vibrante de coral lo hace una excelente opción para notificaciones y elementos de llamada a la acción, como botones y alertas críticas.
- Mejorar la navegación. Usa coral para efectos de hover para mostrar claramente dónde está el cursor del usuario en la pantalla. Su energía brillante ayuda a mantener a los usuarios en el camino correcto.
Ten en cuenta que el color y su significado pueden variar según la cultura y el contexto. Si diseñas para una audiencia internacional, investiga cómo se perciben los colores en cada país.
Para variaciones dentro del mismo espectro acogedor y energético que coral, considera:
- Rosa (#FF8DA1) se encuentra junto a coral en el círculo cromático pero ofrece mayores influencias rojas.
- Salmón (#FA8072) se asemeja mucho a coral pero tiene un toque distintivo de naranja, dándole una sensación más suave y amigable.
- Mandarina (#FFA800) es perfecta para una paleta más energética, ofreciendo un toque de vitalidad rojizo-anaranjado.
- Melón (#FFA62F) se encuentra en la misma área del círculo cromático que coral, proporcionando una sensación similar con toques adicionales de vibrancia naranja.
Para complementar coral, considera emparejarlo con:
- Cerúleo (#007BA7) crea un contraste relajado al complementar la vibrancia de coral.
- Azul marino (#000080) tiene un tono profundo y frío que combina bien con la apariencia más cálida de coral.
- Topo (#54463A) es un color neutro que funciona bien como fondo sutil con la vivacidad de coral.
- Lavanda (#D3D3FF) es un color suave y calmante que complementa la apariencia vibrante de coral mientras añade una sensación de lujo.
- Chocolate (#7B3F00) es un color marrón profundo y terroso con un tono cálido que complementa coral.
Otros colores que vale la pena considerar incluyen azul cielo y verde petróleo, que proporcionan un contraste relajante. Marfil y negro también pueden añadir sensaciones de calidez o audacia, respectivamente.
Aunque coral es cálido y vibrante, puede chocar con:
- Verde lima (#89F336) puede ser vibrante como coral, pero sus matices chocan, creando un efecto discordante.
- Granate (#550000) tiene un tono rojo profundo similar a coral, pero su falta de contraste crea una apariencia turbia.
- Amarillo pastel (#FFEE8C) tiene un tono apagado que puede parecer deslavado junto a coral, creando un efecto plano.
- Verde bosque (#2E6F40) es un tono profundo que puede fácilmente abrumar y minimizar la vibrancia natural de coral.
Coral simboliza ambientes tropicales y una sensación de calma y relajación. Su tono cálido también sugiere juego, mientras que su conexión con los arrecifes de coral indica vitalidad y crecimiento.
En la psicología del color, coral evoca calidez, paz y tranquilidad, pero su calidad vibrante también fomenta sentimientos de optimismo y esperanza.
En el diseño de interfaces, coral es excelente para atraer la atención, y es perfecto para crear una atmósfera de ocio tropical o relajación veraniega. Sus cualidades juguetonas también lo hacen un color popular para diseños infantiles.
El color coral lleva el nombre de los invertebrados marinos que forman los arrecifes de coral. La palabra se usó por primera vez para describir un color en el siglo XVI cuando exploradores ingleses descubrieron los vibrantes tonos del coral oceánico.
Las culturas orientales asociaban los tonos rojos de la sombra con la inmortalidad, vinculados a la sangre y la naturaleza regenerativa de los organismos de coral. En la Europa medieval, coral se asociaba con la riqueza, convirtiéndose en una elección popular para joyería debido a su rareza y belleza. Las culturas mediterráneas, incluidos los griegos y romanos, creían que el coral podía proteger contra el mal.
Para el siglo XVIII, los pigmentos desarrollados a partir de óxido de hierro facilitaron la reproducción de tonos coral, y los artistas usaron el tono para representar vistas naturales como amaneceres y atardeceres.
Variantes de color
Sombras
Tintes
Tonos
Matices
Armonías de color
Complementario
Dividido
Monocromático
Análogo
Triádico
Cuadrado
Paletas personalizadas
Mercado de Especias
Calles de Pamplona
Guayaba
Verificador de contraste
Contraste 2,4
- Texto grande
#FF8559
- Texto normal
Tu forma de diseñar, alinear y crear importa. Hazlo todo con Figma.
| Categoría | ||
|---|---|---|
Desaprobado | Desaprobado | |
Desaprobado | Desaprobado | |
Desaprobado | Desaprobado |
Contraste 8,75
- Texto grande
#FF8559
- Texto normal
Tu forma de diseñar, alinear y crear importa. Hazlo todo con Figma.
| Categoría | ||
|---|---|---|
Aprobado | Aprobado | |
Aprobado | Aprobado | |
Aprobado | Aprobado |
Simulaciones de color
Protanopia
Deuteranopia
Tritanopia
Acromatopsia
El color hexadecimal #ff8559, también conocido como Coral, tiene valores RGB de R:255, G:133, B:89 y valores CMYK de C:0, M:48, Y:65, K:0.
| VALUE | CSS | |
|---|---|---|
| HEX | #ff8559 | #ff8559 |
| RGB DECIMAL | 255, 133, 89 | RGB(255,133,89) |
| RGB PERCENTAGE | 100.0, 52.2, 34.9 | RGB(100.0%,52.2%,34.9%) |
| CMYK | 0, 48, 65, 0 | |
| HSL | HSL(15.9, 100.0%, 67.5%) | HSL(15.9, 100.0%, 67.5%) |
| HSV (OR HSB) | 15.9°, 65.1, 100.0 | |
| WEB SAFE | #255153102 | #255153102 |
| BINARY | 11111111, 10000101, 01011001 | |
| iOS - SwiftUI | Color(red: 1.000, green: 0.522, blue: 0.349) | |
| iOS - UIKit | UIColor(red: 1.000, green: 0.522, blue: 0.349, alpha: 1) | |
| Android - Compose | Color(0xFFFF8559) |
