Bauhaus — 5-color palette
#E63946#F1FAEE#1D3557#FFD166#000000Hex codes
Hex
#E63946
RGB
230, 57, 70
HSL
355°, 78%, 56%
Hex
#F1FAEE
RGB
241, 250, 238
HSL
105°, 55%, 96%
Hex
#1D3557
RGB
29, 53, 87
HSL
215°, 50%, 23%
Hex
#FFD166
RGB
255, 209, 102
HSL
42°, 100%, 70%
Hex
#000000
RGB
0, 0, 0
HSL
0°, 0%, 0%
How to use this palette
The first color in Bauhaus is the dominant tone — use it for primary surfaces and backgrounds. The middle three are the supporting palette: one warm, one cool, one neutral. The last is the accent — reserve it for highlights, calls-to-action, and emphasis.
For web projects, copy the CSS variables below. For print or illustration, use the hex codes directly. If you’re designing for accessibility, check the contrast between the text and background colors before you ship.
CSS
:root {
--bauhaus-1: #E63946;
--bauhaus-2: #F1FAEE;
--bauhaus-3: #1D3557;
--bauhaus-4: #FFD166;
--bauhaus-5: #000000;
}