Palette #091413 #285A48 #408A71 #B0E4CC

Curated four-color harmony tagged under dark, cold, winter, night, black, green, mint, teal, pastel, light. Free for personal and commercial digital design projects.

#091413 (41%)
#285A48 (26%)
#408A71 (18%)
#B0E4CC (15%)

Palette Specifications & Color Values

Swatch HEX RGB Luminance Recommended Role
#091413 rgb(9, 20, 19) 0.006 41% Base Canvas / Background
#285A48 rgb(40, 90, 72) 0.082 26% Surface / Card Container
#408A71 rgb(64, 138, 113) 0.205 18% Muted Element / Borders
#B0E4CC rgb(176, 228, 204) 0.691 15% Focal Accent / Call to Action

Color Theory & Mood Analysis

This color collection radiates a serene, clean, and tranquil ambiance, making it ideal for digital product interfaces, modern SaaS web applications, mobile user interfaces, brand style guides, and graphic illustrations. Following classical four-tier visual weight balance, the dominant primary tone establishes an expansive ground surface, the secondary hue defines cards and panels, the structural third color bounds elements cleanly, and the high-contrast accent directs user attention to interactive elements.

WCAG 2.1 Accessibility & Contrast Validation

Ensuring accessible contrast is vital for inclusive design. The linearized contrast ratio between Base Canvas (#091413) and Focal Accent (#B0E4CC) is 13.2:1, scoring WCAG AAA Pass under W3C WCAG 2.1 specifications. Additionally, the contrast between Surface (#285A48) and Accent (#B0E4CC) measures 5.6:1 (WCAG AA Pass). These metrics provide designers with mathematical certainty for legible typography and interactive accessibility.

Developer Tokens & Integration

Integrate this palette directly into your frontend build pipeline:

:root {
  --color-canvas: #091413;
  --color-surface: #285A48;
  --color-border: #408A71;
  --color-accent: #B0E4CC;
}