Darkroom
A complete five-role scheme. minimal and bold in character — tagged for photography.
primary
#d97706 secondary
#7c7c7c accent
#38bdf8 background
#121212 text
#f0ede8 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 | #d97706 | 217, 119, 6 | 32°, 95%, 44% |
| secondary | #7c7c7c | 124, 124, 124 | 0°, 0%, 49% |
| accent | #38bdf8 | 56, 189, 248 | 198°, 93%, 60% |
| background | #121212 | 18, 18, 18 | 0°, 0%, 7% |
| text | #f0ede8 | 240, 237, 232 | 38°, 21%, 93% |
Contrast (WCAG)
| Pair | Ratio | Level |
|---|---|---|
| text on background | 16.04 | AAA |
| primary on background | 5.88 | AA |
| secondary on background | 4.49 | AA-large |
| accent on background | 8.74 | AAA |
| background on primary | 5.88 | AA |
| background on accent | 8.74 | AAA |
CSS variables
:root {
--color-primary: #d97706;
--color-secondary: #7c7c7c;
--color-accent: #38bdf8;
--color-bg: #121212;
--color-text: #f0ede8;
}Tailwind
colors: {
primary: '#d97706',
secondary: '#7c7c7c',
accent: '#38bdf8',
background: '#121212',
text: '#f0ede8',
}