El esmeralda es un verde exuberante y vibrante que exuda lujo y elegancia. Situado entre el verde y el azul en la rueda de colores, su tono rico y joya brilla como ningún otro. Evocando tonos como el jade y el verde azulado, el esmeralda añade sofisticación a los diseños, perfecto para crear una sensación clásica y opulenta.

El esmeralda se define por los siguientes códigos y valores de color para asegurar la consistencia en varias plataformas y dispositivos digitales.
- Código Hex: #50C878
- Valor RGB: 31.4% rojo, 78.4% verde, 47.1% azul
Las consideraciones de accesibilidad juegan un papel crucial en las elecciones de color de diseño UX y UI. Figma ofrece plugins en la Comunidad para asegurarse de que tus diseños cumplan con las Pautas de Accesibilidad de Contenidos Web
Para variaciones dentro del mismo espectro que el esmeralda, considera:
- Verde Jade (#00bb77): El Verde Jade canaliza la sensación vibrante y exuberante del Esmeralda con su rico tono verde, creando un visual animado e invigorante similar a un follaje denso.
- Verde Oscuro (#06402b): Ofreciendo un tono más profundo e intenso, el Verde Oscuro complementa la vibra lujosa del Esmeralda mientras mantiene una profunda serenidad natural.
- Verde Bosque (#2e6f40): El Verde Bosque encarna la esencia tranquila de la naturaleza con su tono profundo y arraigado, reflejando de cerca el cautivador tono verde del Esmeralda.
- Verde Cazador (#2c5f34): El Verde Cazador refleja la riqueza profunda y aterciopelada similar al Esmeralda, evocando las serenas profundidades de un bosque denso con su hermoso tono oscuro.
Para complementar el Esmeralda, considera emparejarlo con:
- Melocotón (#FFD3AC): Este tono suave y cálido equilibra la frescura del Esmeralda, creando una paleta suave y armoniosa que recuerda a la primavera.
- Champán (#F7E6CA): Su tono claro y apagado ofrece un contraste sutil que permite que las cualidades vibrantes del Esmeralda brillen, añadiendo elegancia al diseño general.
- Azul Real (#305CDE): Este azul audaz contrasta hermosamente con el rico verde del Esmeralda, creando un aspecto regio y dinámico. Evoca una combinación llamativa de tonos joya que recuerda a las piedras preciosas.
- Beige (#EDE8D0): Con su fondo neutral, el beige proporciona un contrapunto calmante, permitiendo que el Esmeralda sea el protagonista sin dominar la paleta.
- Naranja Quemado (#BE5103): Un contraste cálido y terroso realza el vibrante verde del Esmeralda, creando una combinación llamativa e inspirada en la naturaleza que se siente equilibrada y dinámica.
Mientras que el Esmeralda (HEX #00674F) es un tono rico y vibrante a menudo asociado con el lujo y la naturaleza, ciertos colores pueden chocar con él, creando combinaciones menos armoniosas:
- Rosa Neón (#FF13F0): El brillo del Rosa Neón crea un contraste agudo contra el Esmeralda, haciendo que ambos colores compitan visualmente en lugar de complementarse.
- Óxido (#B7410E): El óxido tiene un tono cálido y terroso que puede chocar con la cualidad más fresca y vívida del Esmeralda, resultando en una mezcla discordante.
- Rojo Carmesí (#B22222): La intensidad del Rojo Carmesí puede eclipsar la elegancia del Esmeralda, llevando a una combinación que se siente visualmente pesada y desequilibrada.
- Naranja Neón (#FF5C00): La audacia del Naranja Neón puede abrumar la sutileza del Esmeralda, creando una paleta discordante y excesivamente vibrante.
- Chartreuse (#CCFF00): La alta saturación del Chartreuse puede eclipsar la profundidad del Esmeralda, resultando en una combinación visualmente ruidosa y poco refinada.
Variantes de color
Sombras
Tintes
Tonos
Tonalidades
Armonías de color
Complementaria
Complementaria dividida
Monocromática
Análoga
Triádica
Square
Paletas personalizadas
Salpicadura Verde
Rubor Botánico
Pradera Encantada
Comprobador de contraste
Contraste 2,13
- Texto largo
#50C878
- Texto normal
Cómo diseñas, alineas, y desarrollas importa. Hazlo con Figma.
| Categoría | ||
|---|---|---|
Desaprobar | Desaprobar | |
Desaprobar | Desaprobar | |
Desaprobar | Desaprobar |
Contraste 9,87
- Texto largo
#50C878
- Texto normal
Cómo diseñas, alineas, y desarrollas importa. Hazlo con Figma.
| Categoría | ||
|---|---|---|
Aprobar | Aprobar | |
Aprobar | Aprobar | |
Aprobar | Aprobar |
Simulaciones de color
Protanopia
Deuteranopia
Tritanopia
Acromatopsia
El color hexadecimal #50C878, también llamado Esmeralda, tiene valores RGB de R:80, G:200, B:120 y valores CMYK de C:60, M:0, Y:40, K:22.
| VALUE | CSS | |
|---|---|---|
| HEX | #50C878 | #50C878 |
| RGB DECIMAL | 80, 200, 120 | RGB(80,200,120) |
| RGB PERCENTAGE | 31.4, 78.4, 47.1 | RGB(31.4%,78.4%,47.1%) |
| CMYK | 60, 0, 40, 22 | |
| HSL | HSL(140.0, 52.2%, 54.9%) | HSL(140.0, 52.2%, 54.9%) |
| HSV (OR HSB) | 140.0°, 60.0, 78.4 | |
| WEB SAFE | #102204102 | #102204102 |
| BINARY | 01010000, 11001000, 01111000 | |
| iOS - SwiftUI | Color(red: 0.314, green: 0.784, blue: 0.471) | |
| iOS - UIKit | UIColor(red: 0.314, green: 0.784, blue: 0.471, alpha: 1) | |
| Android - Compose | Color(0xFF50C878) |