Skip to main content
classic

Obsidian and Off White

16.03:1 contrast ratio —

AAA

Visual Preview

#1B1B2FObsidian
#FAF9F6Off White

The quick brown fox

Body text — Obsidian on Off White

Supporting text at reduced opacity

Badge

Reversed — Off White on Obsidian

Inverted combination preview

Contrast Analysis

Contrast Ratio

16.03:1

AAA

WCAG AA

✓ Pass

Requires 4.5:1

WCAG AA Large

✓ Pass

Requires 3:1

WCAG AAA

✓ Pass

Requires 7:1

Color Values

Obsidian

Foreground (Text)

HEX
#1B1B2F
RGB
rgb(27, 27, 47)
HSL
hsl(240, 27%, 15%)

Off White

Background

HEX
#FAF9F6
RGB
rgb(250, 249, 246)
HSL
hsl(45, 29%, 97%)

Design Use Cases

  • Editorial design and typography
  • Legal documents
  • Print media
  • Minimalist UI
  • Technical documentation

Industry Recommendations

Accessibility-First Products
Publishing
Legal Services
Education
Government

Color Psychology

The Obsidian tone evokes sophistication, power, and elegance, while Off White brings purity, clarity, and simplicity. Together, they create a balanced palette suited for compelling visual communication.

Palette Exports

:root {
  --color-obsidian: #1B1B2F;
  --color-off-white: #FAF9F6;
}

.combo-obsidian-off-white {
  color: var(--color-obsidian);
  background-color: var(--color-off-white);
}

Quick Snippets

CSS Variables

:root {
  --color-obsidian: #1B1B2F;
  --color-off-white: #FAF9F6;
}

Tailwind CSS

<div class="bg-white text-slate-900">
  Your content here
</div>

Individual Colors

Similar Combinations