Aurora Night
A complete five-role scheme. vibrant and creative in character — tagged for gaming, tech.
primary
#7c3aed secondary
#2dd4bf accent
#f472b6 background
#0e1026 text
#e9e7f7 AcmeSign up
Ship your next idea faster
Everything you need to launch, in one place.
Get started Learn moreOpen this scheme in the Studio →
Color values
| Role | Hex | RGB | HSL |
|---|---|---|---|
| primary | #7c3aed | 124, 58, 237 | 262°, 83%, 58% |
| secondary | #2dd4bf | 45, 212, 191 | 172°, 66%, 50% |
| accent | #f472b6 | 244, 114, 182 | 329°, 86%, 70% |
| background | #0e1026 | 14, 16, 38 | 235°, 46%, 10% |
| text | #e9e7f7 | 233, 231, 247 | 248°, 50%, 94% |
Contrast (WCAG)
| Pair | Ratio | Level |
|---|---|---|
| text on background | 15.38 | AAA |
| primary on background | 3.29 | AA-large |
| secondary on background | 10.07 | AAA |
| accent on background | 7.07 | AAA |
| background on primary | 3.29 | AA-large |
| background on accent | 7.07 | AAA |
CSS variables
:root {
--color-primary: #7c3aed;
--color-secondary: #2dd4bf;
--color-accent: #f472b6;
--color-bg: #0e1026;
--color-text: #e9e7f7;
}Tailwind
colors: {
primary: '#7c3aed',
secondary: '#2dd4bf',
accent: '#f472b6',
background: '#0e1026',
text: '#e9e7f7',
}