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 red palette featuring Deep Red, Dark Red, Dark Red.
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 |
|---|---|---|---|---|---|
#641220 | rgb(100, 18, 32) | hsl(350, 69%, 23%) | Deep Red | View | |
#6E1423 | rgb(110, 20, 35) | hsl(350, 69%, 25%) | Dark Red | View | |
#85182A | rgb(133, 24, 42) | hsl(350, 69%, 31%) | Dark Red | View | |
#A11D33 | rgb(161, 29, 51) | hsl(350, 69%, 37%) | Dark Red | View | |
#A71E34 | rgb(167, 30, 52) | hsl(350, 70%, 39%) | Dark Red | View | |
#B21E35 | rgb(178, 30, 53) | hsl(351, 71%, 41%) | Dark Red | View | |
#BD1F36 | rgb(189, 31, 54) | hsl(351, 72%, 43%) | Dark Red | View | |
#C71F37 | rgb(199, 31, 55) | hsl(351, 73%, 45%) | Red | View | |
#DA1E37 | rgb(218, 30, 55) | hsl(352, 76%, 49%) | Pure Red | View | |
#E01E37 | rgb(224, 30, 55) | hsl(352, 76%, 50%) | Pure Red | View |
:root {
--color-1: #641220;
--color-2: #6E1423;
--color-3: #85182A;
--color-4: #A11D33;
--color-5: #A71E34;
--color-6: #B21E35;
--color-7: #BD1F36;
--color-8: #C71F37;
--color-9: #DA1E37;
--color-10: #E01E37;
}Palettes that share visual characteristics and color harmony.