Arena es un neutro cálido y pálido que captura perfectamente la esencia de un entorno natural y terroso. Se encuentra en el lado más claro y cálido del espectro marrón en la rueda de colores, y varía desde crema pálido hasta beige dorado. Su tono suave e invitante aporta un toque de elegancia discreta.

Arena se define por los siguientes códigos y valores de color para asegurar la consistencia en diversas plataformas y dispositivos digitales.
- Código HEX: #CBBD93
- Valor RGB: 79.6% rojo, 74.1% verde y 57.6% azul
La accesibilidad juega un papel clave en la elección de colores en el diseño UX y UI. La comunidad de Figma ofrece plugins para ayudarte a cumplir con las Web Content Accessibility Guidelines.
Aquí hay algunas formas de aprovechar las cualidades naturales y calmantes de arena para crear un diseño amigable y visualmente atractivo:
- Crea un fondo neutro. El tono suave y neutro de arena crea un fondo tranquilo y discreto que ayuda a que el contenido destaque sin abrumar la vista.
- Mejora la legibilidad. Combina arena con tonos más profundos como azul marino, verde bosque o carbón para el texto, asegurando la legibilidad mientras mantienes un contraste estéticamente agradable.
- Promueve un ambiente relajante. Arena es perfecto para aplicaciones o sitios web enfocados en bienestar, meditación, viajes o ocio. Ayuda a establecer un ambiente relajado que se alinea con actividades de descanso o paz.
- Complementa con tonos tierra. Para crear un diseño armonioso y cohesivo, combina arena con otros tonos tierra como verdes, marrones y cremas. Esta paleta es agradable a la vista y refuerza una conexión con el mundo natural, lo que puede mejorar los elementos temáticos de marcas ecológicas u orgánicas.
- Destaca elementos interactivos. Combina arena con colores más vibrantes para llamar la atención sobre elementos como botones o enlaces, o utiliza variaciones de tonos de arena para crear una jerarquía sutil en tu diseño.
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 terroso que arena, considera:
- Caqui (#C3B091) ofrece un tono ligeramente más oscuro, manteniendo la sensación cálida y neutra de arena.
- Beige (#F5F5DC) es más claro y proporciona una apariencia más suave mientras mantiene la vibra natural.
- Bronceado (#D6B588) tiene un poco más de marrón, evocando la elegancia cálida y discreta de arena.
- Crema (#FDFBD4) introduce un tono más pálido y relajante que complementa el sutil matiz de arena.
Para complementar los tonos sutiles de arena, considera combinarlo con:
- Azul marino (#000080) crea un contraste clásico, realzando la elegancia discreta de arena.
- Verde bosque (#228B22) ofrece un contraste rico y natural que armoniza con la terrosidad de arena.
- Burdeos (#660033) proporciona un contraste profundo y rico que hace resaltar los tonos apagados de arena.
- Gris cálido (#D3D3D3) se alinea estrechamente con las propiedades neutras de arena, ofreciendo una paleta moderna y elegante.
- Durazno suave (#FFE5B4) complementa arena con una calidez suave e invitante.
Otros colores que vale la pena considerar incluyen verde petróleo profundo para enfatizar un contraste sofisticado, coral claro para un aspecto suave e invitante, y lila pálido para una interacción sutil y juguetona.
Aunque arena es versátil, puede chocar con:
- Rosa brillante (#FF69B4) puede eclipsar la naturaleza sutil y apagada de arena con su vibrante intensidad.
- Azul eléctrico (#00F0FF) podría ser demasiado llamativo, creando un aspecto discordante contra la suavidad de arena.
- Amarillo limón (#FFF44F) tiende a contrastar demasiado, potencialmente dominando la naturaleza suave de arena.
- Plata (#C4C4C4) puede parecer demasiado frío y metálico contra el tono cálido y terroso de arena.
- Gris carbón (#4A4A4A) puede ser demasiado audaz y oscuro, lo que puede disminuir la calidad relajante de arena.
Arena evoca sentimientos de calma, relajación y estabilidad. La psicología del color ve arena como conservador, simbolizando confort, simplicidad y una conexión natural. Transmite apertura y tranquilidad.
En el diseño de UI/UX, arena ofrece un fondo limpio y despejado, señalando fiabilidad y practicidad. Es adecuado para diseños que buscan sentirse cálidos y acogedores, haciendo que los usuarios se sientan a gusto.
Diversas culturas y contextos históricos han favorecido durante mucho tiempo el color arena debido a su amplia ocurrencia natural y aplicaciones versátiles. La elección de usar materiales de color arena en ropa y arquitectura a menudo provino de los recursos disponibles. Por ejemplo, edificios y prendas en regiones desérticas a menudo coinciden con el paisaje arenoso para mezclarse con el entorno natural y reflejar la luz solar, reduciendo la absorción de calor.
Durante siglos, arena ha sido un color popular en la moda debido a su tono neutro, que combina fácilmente con otros colores. Su popularidad recurrente en uniformes militares también se debe a sus beneficios funcionales en desiertos y otros entornos de color claro, donde el camuflaje de color arena ofrece una ventaja.
Variantes de color
Sombras
Tintes
Tonos
Matices
Armonías de color
Complementario
Dividido
Monocromático
Análogo
Triádico
Cuadrado
Paletas personalizadas
Arenas Nocturnas
Turmalina
Lutita
Verificador de contraste
Contraste 1,87
- Texto grande
#CBBD93
- Texto normal
Tu forma de diseñar, alinear y crear importa. Hazlo todo con Figma.
| Categoría | ||
|---|---|---|
Desaprobado | Desaprobado | |
Desaprobado | Desaprobado | |
Desaprobado | Desaprobado |
Contraste 11,24
- Texto grande
#CBBD93
- 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 #cbbd93, también conocido como Color arena, tiene valores RGB de R:203, G:189, B:147 y valores CMYK de C:0, M:7, Y:28, K:20.
| VALUE | CSS | |
|---|---|---|
| HEX | #cbbd93 | #cbbd93 |
| RGB DECIMAL | 203, 189, 147 | RGB(203,189,147) |
| RGB PERCENTAGE | 79.6, 74.1, 57.6 | RGB(79.6%,74.1%,57.6%) |
| CMYK | 0, 7, 28, 20 | |
| HSL | HSL(45.0, 35.0%, 68.6%) | HSL(45.0, 35.0%, 68.6%) |
| HSV (OR HSB) | 45.0°, 27.6, 79.6 | |
| WEB SAFE | #204204153 | #204204153 |
| BINARY | 11001011, 10111101, 10010011 | |
| iOS - SwiftUI | Color(red: 0.796, green: 0.741, blue: 0.576) | |
| iOS - UIKit | UIColor(red: 0.796, green: 0.741, blue: 0.576, alpha: 1) | |
| Android - Compose | Color(0xFFCBBD93) |


