Loading
Preparing the next color view
Building palettes, metadata, and layout pieces for this route.
Building palettes, metadata, and layout pieces for this route.
A natural palette in tetradic tones.
See how this palette performs in real-world UI mockups.
Experience the perfect harmony of colors calculated for your brand identity.
| Swatch | HEX | RGB | HSL | Name | Details |
|---|---|---|---|---|---|
#38BB7C | rgb(56, 187, 124) | hsl(151, 54%, 48%) | Soft Emerald | View | |
#3936B2 | rgb(57, 54, 178) | hsl(241, 53%, 45%) | Soft Blue | View | |
#9C3667 | rgb(156, 54, 103) | hsl(331, 49%, 41%) | Dark Soft Pink | View | |
#A1A33C | rgb(161, 163, 60) | hsl(61, 46%, 44%) | Dark Soft Yellow | View | |
#31885E | rgb(49, 136, 94) | hsl(151, 47%, 36%) | Dark Soft Emerald | View |
:root {
--color-1: #38BB7C;
--color-2: #3936B2;
--color-3: #9C3667;
--color-4: #A1A33C;
--color-5: #31885E;
}Palettes that share visual characteristics and color harmony.