Dark Slate Gray#264653
Light Sea Green#2A9D8F
Burlywood#E9C46A
Sandy Brown#F4A261
Terracotta#E76F51
Color Palette
#264653 · #2A9D8F · #E9C46A · #F4A261 · #E76F51
triadic0 likes
Share
Export for Developers
:root {
--color-1: #264653;
--color-1-rgb: 38, 70, 83;
--color-1-hsl: 197, 37%, 24%;
--color-2: #2A9D8F;
--color-2-rgb: 42, 157, 143;
--color-2-hsl: 173, 58%, 39%;
--color-3: #E9C46A;
--color-3-rgb: 233, 196, 106;
--color-3-hsl: 43, 74%, 66%;
--color-4: #F4A261;
--color-4-rgb: 244, 162, 97;
--color-4-hsl: 27, 87%, 67%;
--color-5: #E76F51;
--color-5-rgb: 231, 111, 81;
--color-5-hsl: 12, 76%, 61%;
}Real World Preview
Get Started
Accessibility
WCAG Accessibility Report
Excellent#264653
On White
10.08:1AAA
On Black
2.08:1Fail
Aa
Aa
#2A9D8F
On White
3.32:1Fail
On Black
6.32:1AA
Aa
Aa
#E9C46A
On White
1.67:1Fail
On Black
12.57:1AAA
Aa
Aa
#F4A261
On White
2.06:1Fail
On Black
10.19:1AAA
Aa
Aa
#E76F51
On White
3.09:1Fail
On Black
6.79:1AA
Aa
Aa
Contrast ratios calculated per WCAG 2.1. AA requires ≥4.5:1, AAA requires ≥7:1 for normal text.
Palette Variations
Palette Variations
Original
☀️
lighter
· Increased lightness, reduced saturation
#527D8E
#64C9BD
#F2E5C4
#F7DBC4
#EFBBAF
🌑
darker
· Reduced lightness, increased saturation
#070F12
#124F48
#D29D19
#E66D0A
#BD3614
🌫️
muted
· Desaturated for a calm, muted look
#393F41
#487F79
#CEB982
#DBA67B
#C9806E
⚡
vibrant
· Boosted saturation for maximum impact
#2284AA
#0CC0AB
#FFC533
#FF8F33
#FF5C33