Bedroom Color Palette

Muted sage walls with warm off-white trim — low saturation and mid-low lightness keep a bedroom calm and sleep-friendly. Anchors: #9CAF88, #F5F0E6, #6D7A5F.

bedroominteriorcalm
#9CAF88
#F5F0E6
#6D7A5F
#D2DAC8
#9F9B99
#9caf88 #f5f0e6 #6d7a5f #d2dac8 #9f9b99
#9CAF88 #F5F0E6 #6D7A5F #D2DAC8 #9F9B99

Semantic roles

Assigned deterministically: lightest = background, darkest = text, most saturated = primary.

background#F5F0E6
surface#D2DAC8
text#6D7A5F
text-muted#9F9B99
primary#9CAF88
secondary#D2DAC8
accent#9F9B99

CSS variables

:root {
  --background: #f5f0e6;
  --surface: #d2dac8;
  --text: #6d7a5f;
  --text-muted: #9f9b99;
  --primary: #9caf88;
  --secondary: #d2dac8;
  --accent: #9f9b99;
}
Preview in UIs →

Accessibility matrix

Text color (rows) on background (columns). Green = WCAG AA pass for normal text (≥4.5:1).

Text \ BG#9CAF88#F5F0E6#6D7A5F#D2DAC8#9F9B99
#9CAF88
1.0
2.1
1.9
1.6
1.2
#F5F0E6
2.1
1.0
4.0
1.3
2.4
#6D7A5F
1.9
4.0
1.0
3.2
1.7
#D2DAC8
1.6
1.3
3.2
1.0
1.9
#9F9B99
1.2
2.4
1.7
1.9
1.0

Under deuteranopia

Machado et al. (2009) simulation, severity 1.0 — approximation, not a medical tool.

Colors in this palette

Similar palettes

FAQ

How do I use the bedroom color palette in CSS?

Copy the CSS variables below into :root and use var(--primary), var(--background) etc. Full palette: #9CAF88, #F5F0E6, #6D7A5F, #D2DAC8, #9F9B99.

Do these colors pass accessibility checks?

See the WCAG matrix on this page: every text-on-background pairing with ratio ≥ 4.5 passes AA for normal text; ≥ 3 passes AA for large text and UI components.