ColorPaletteXYZ Logo
ColorPaletteXYZ
Palettes/App UI

SaaS Obsidian Slate

Deep obsidian dark mode interface palette with vivid sky-blue focal accents for modern developer dashboards.

#App UI#Modern#UI#Clean#Dark
Open in Generator
COLOR 1
#0B0F17
Midnight Onyx
COLOR 2
#1E293B
Slate 800
COLOR 3
#334155
Slate 700
COLOR 4
#38BDF8
Deep Sky Blue
COLOR 5
#F8FAFC
Slate 50

Color Values & Codes

HEX · RGB · HSL
rgb(11, 15, 23)hsl(220, 35%, 7%)Color details →
Slate 800
#1E293B
rgb(30, 41, 59)hsl(217, 33%, 17%)Color details →
Slate 700
#334155
rgb(51, 65, 85)hsl(215, 25%, 27%)Color details →
rgb(56, 189, 248)hsl(198, 93%, 60%)Color details →
Slate 50
#F8FAFC
rgb(248, 250, 252)hsl(210, 40%, 98%)Color details →

Open In Design Tools

Palette Generator
Lock & shuffle colors
Contrast Checker
Test WCAG compliance
Shades & Tints
Generate tonal steps
App UI Palettes
Explore category schemes

CSS Variables

Copy & paste directly into your stylesheet
:root {
  --color-1: #0B0F17;
  --color-2: #1E293B;
  --color-3: #334155;
  --color-4: #38BDF8;
  --color-5: #F8FAFC;
}

Role-Based WCAG Contrast Audit

Accessibility contrast depends on assigned UI roles. Here are the contrast ratios and WCAG compliance ratings when pairing palette colors as Foreground Text against Background surfaces:

Sample Text
#0B0F17 on #38BDF88.95:1
Normal Text AA Pass
Sample Text
#0B0F17 on #F8FAFC18.33:1
Normal Text AA Pass
Sample Text
#1E293B on #38BDF86.83:1
Normal Text AA Pass
Sample Text
#1E293B on #F8FAFC13.98:1
Normal Text AA Pass
Sample Text
#334155 on #38BDF84.83:1
Normal Text AA Pass
Sample Text
#334155 on #F8FAFC9.90:1
Normal Text AA Pass

Related Palettes in App UI

Explore App UI
#0F172ACopy
#1E293BCopy
#2563EBCopy
#38BDF8Copy
#F8FAFCCopy
cp-featured-01Technology
SaaS Velocity Blue
TechModernCool
#180F33Copy
#491F79Copy
#7C3AEDCopy
#A78BFACopy
#F5F3FFCopy
cp-featured-05App UI
Fluid iOS Violet
App UICreative
#0B0B0BCopy
#1C1917Copy
#B45309Copy
#D97706Copy
#FDE68ACopy
cp-featured-06Luxury
Haute Couture Noir & Gold
LuxuryDarkFashion
#314E35Copy
#588157Copy
#A3B18ACopy
#FFE6A7Copy
#DDA15ECopy
cp-featured-18Food
Matcha Yuzu Delight
FoodCleanFresh