Vaporwave Dusk Color Palette
A synthwave dusk that flows in one ramp — peach and coral into hot magenta, through amethyst and indigo to electric cyan and a pale neon glow. Lift any slice for a gradient, or use the full run as a vaporwave sky behind chrome type and palm silhouettes. Dreamy, nostalgic, and unapologetically 1984.
Get Paintrix free on the App Store.
Download
Hex codes
Color theory
Base
Complement
Analogous −30°
Analogous +30°
Triadic
Use it for
Code formats
CSS
:root {
--vaporwave-sunset-1: #FFD9A8;
--vaporwave-sunset-2: #FFC089;
--vaporwave-sunset-3: #FFA679;
--vaporwave-sunset-4: #FB8C77;
--vaporwave-sunset-5: #F2737F;
--vaporwave-sunset-6: #E55C8A;
--vaporwave-sunset-7: #D44792;
--vaporwave-sunset-8: #C0359A;
--vaporwave-sunset-9: #A92A9E;
--vaporwave-sunset-10: #8F239C;
--vaporwave-sunset-11: #751F93;
--vaporwave-sunset-12: #5C1C84;
--vaporwave-sunset-13: #4A2C8E;
--vaporwave-sunset-14: #3E2F96;
--vaporwave-sunset-15: #34349E;
--vaporwave-sunset-16: #2C3DA6;
--vaporwave-sunset-17: #2649AE;
--vaporwave-sunset-18: #2156B4;
--vaporwave-sunset-19: #1E6BBE;
--vaporwave-sunset-20: #1C7FC6;
--vaporwave-sunset-21: #1E93CC;
--vaporwave-sunset-22: #26A6D0;
--vaporwave-sunset-23: #36B8D6;
--vaporwave-sunset-24: #4FC8DC;
--vaporwave-sunset-25: #6FD6E0;
--vaporwave-sunset-26: #88DEE6;
--vaporwave-sunset-27: #A2E6EA;
--vaporwave-sunset-28: #BEEEEE;
--vaporwave-sunset-29: #DAF5F3;
--vaporwave-sunset-30: #EFFAF8;
}SCSS
$vaporwave-sunset-1: #FFD9A8;
$vaporwave-sunset-2: #FFC089;
$vaporwave-sunset-3: #FFA679;
$vaporwave-sunset-4: #FB8C77;
$vaporwave-sunset-5: #F2737F;
$vaporwave-sunset-6: #E55C8A;
$vaporwave-sunset-7: #D44792;
$vaporwave-sunset-8: #C0359A;
$vaporwave-sunset-9: #A92A9E;
$vaporwave-sunset-10: #8F239C;
$vaporwave-sunset-11: #751F93;
$vaporwave-sunset-12: #5C1C84;
$vaporwave-sunset-13: #4A2C8E;
$vaporwave-sunset-14: #3E2F96;
$vaporwave-sunset-15: #34349E;
$vaporwave-sunset-16: #2C3DA6;
$vaporwave-sunset-17: #2649AE;
$vaporwave-sunset-18: #2156B4;
$vaporwave-sunset-19: #1E6BBE;
$vaporwave-sunset-20: #1C7FC6;
$vaporwave-sunset-21: #1E93CC;
$vaporwave-sunset-22: #26A6D0;
$vaporwave-sunset-23: #36B8D6;
$vaporwave-sunset-24: #4FC8DC;
$vaporwave-sunset-25: #6FD6E0;
$vaporwave-sunset-26: #88DEE6;
$vaporwave-sunset-27: #A2E6EA;
$vaporwave-sunset-28: #BEEEEE;
$vaporwave-sunset-29: #DAF5F3;
$vaporwave-sunset-30: #EFFAF8;Tailwind
// tailwind.config.js
module.exports = {
theme: {
extend: {
colors: {
'vaporwave-sunset': {
'1': '#FFD9A8',
'2': '#FFC089',
'3': '#FFA679',
'4': '#FB8C77',
'5': '#F2737F',
'6': '#E55C8A',
'7': '#D44792',
'8': '#C0359A',
'9': '#A92A9E',
'10': '#8F239C',
'11': '#751F93',
'12': '#5C1C84',
'13': '#4A2C8E',
'14': '#3E2F96',
'15': '#34349E',
'16': '#2C3DA6',
'17': '#2649AE',
'18': '#2156B4',
'19': '#1E6BBE',
'20': '#1C7FC6',
'21': '#1E93CC',
'22': '#26A6D0',
'23': '#36B8D6',
'24': '#4FC8DC',
'25': '#6FD6E0',
'26': '#88DEE6',
'27': '#A2E6EA',
'28': '#BEEEEE',
'29': '#DAF5F3',
'30': '#EFFAF8',
},
},
},
},
};JSON
{
"name": "Vaporwave Dusk",
"colors": [
"#FFD9A8",
"#FFC089",
"#FFA679",
"#FB8C77",
"#F2737F",
"#E55C8A",
"#D44792",
"#C0359A",
"#A92A9E",
"#8F239C",
"#751F93",
"#5C1C84",
"#4A2C8E",
"#3E2F96",
"#34349E",
"#2C3DA6",
"#2649AE",
"#2156B4",
"#1E6BBE",
"#1C7FC6",
"#1E93CC",
"#26A6D0",
"#36B8D6",
"#4FC8DC",
"#6FD6E0",
"#88DEE6",
"#A2E6EA",
"#BEEEEE",
"#DAF5F3",
"#EFFAF8"
]
}Hex list
#FFD9A8
#FFC089
#FFA679
#FB8C77
#F2737F
#E55C8A
#D44792
#C0359A
#A92A9E
#8F239C
#751F93
#5C1C84
#4A2C8E
#3E2F96
#34349E
#2C3DA6
#2649AE
#2156B4
#1E6BBE
#1C7FC6
#1E93CC
#26A6D0
#36B8D6
#4FC8DC
#6FD6E0
#88DEE6
#A2E6EA
#BEEEEE
#DAF5F3
#EFFAF8