Dark Academia Color Psychology & Meaning
Dark academia lives in the space between candlelight and morning lectures. The palette evokes dusty libraries, Greek tragedy, and the specific melancholy of loving books too much.
#1C1510
#4A3728
#8B6914
#D4C5A9
Background
Primary Accent
Secondary
Body Text
Dark Academia
moodyvintageintellectual autumnwinter brandingfashioneditorial
AAA
WCAG Grade
10.6:1
Contrast Ratio
2,400
Saves
6,300
AI Copies
Use #1C1510 as the background. Use #4A3728 as the primary accent. Use #8B6914 as secondary. Use #D4C5A9 as body text/supporting color. Palette mood: Dark Academia — moody, vintage, intellectual.
Hex Codes, RGB & CMYK Color Values
Technical breakdown for the Dark Academia color scheme. Use these values for web design (HEX/RGB), print projects (CMYK), or specialized design software (HSL).
| Swatch | Design Role | HEX | RGB | CMYK | HSL |
|---|---|---|---|---|---|
| Background Luminance: 0.8% | 28, 21, 16 | 0%, 25%, 43%, 89% | 25°, 27%, 9% | ||
| Primary Accent Luminance: 4.3% | 74, 55, 40 | 0%, 26%, 46%, 71% | 26°, 30%, 22% | ||
| Secondary Luminance: 15.6% | 139, 105, 20 | 0%, 24%, 86%, 45% | 43°, 75%, 31% | ||
| Body Text Luminance: 56.8% | 212, 197, 169 | 0%, 7%, 20%, 17% | 39°, 33%, 75% |
Color Harmony: Analogous Scheme
The Dark Academia palette is built using a analogous relationship between its hues. This ensures that even with high-contrast accents, the overall scheme feels balanced and intentional.
Hue Wheel
A analogous palette is often preferred by professional designers because it creates a calm, serene atmosphere by using neighboring colors.
History & Design Context
Dark academia emerged as an aesthetic on Tumblr and Pinterest around 2015-2016, inspired by Dead Poets Society and The Secret History. It peaked on TikTok in 2020.
Best Design Use Cases
Near-black warm brown for dominant backgrounds in editorial contexts. Rich brown for surfaces. Gold for accent details. Parchment for text on dark backgrounds.
Industries This Palette Suits
Editorial design, fashion brands, book publishing, educational institutions, cafes.
How to Implement the Dark Academia Color Scheme
To use this Dark Academia color palette in your web project, you can copy the following CSS variables or Tailwind CSS configuration. These roles ensure your UI maintains accessibility and visual hierarchy.
Option 1: CSS Variables
:root {
/* {name} Palette - ihatecolors.com */{'
'} --color-bg: {colors[0]};{'
'} --color-primary: {colors[1]};{'
'} --color-secondary: {colors[2]};{'
'} --color-text: {colors[3]};{'
'} {'}'}Web Design Tip
Use #1C1510 for the main background and #4A3728 for primary buttons. This creates a high-contrast focal point.
Accessibility Note
The contrast ratio between #D4C5A9 and #1C1510 is 10.62:1 (AAA). Ensure your body text remains legible.