ColorPaletteXYZ Logo
ColorPaletteXYZ
Palettes/Modern

Studio Signal

modern palette with a balanced five-color hierarchy for design use.

#Modern#Clean#UI
Open in Generator
COLOR 1
#184C6F
Aegean Sea
COLOR 2
#1F70CD
Delphinium Blue
COLOR 3
#6B7CD1
Delphinium Blue
COLOR 4
#F8F8F6
White Smoke
COLOR 5
#1D2E51
Royal Sapphire

Color Values & Codes

HEX · RGB · HSL
Aegean Sea
#184C6F
rgb(24, 76, 111)hsl(204, 64%, 26%)Color details →
rgb(31, 112, 205)hsl(212, 74%, 46%)Color details →
rgb(107, 124, 209)hsl(230, 53%, 62%)Color details →
rgb(248, 248, 246)hsl(60, 12%, 97%)Color details →
rgb(29, 46, 81)hsl(220, 47%, 22%)Color details →

Open In Design Tools

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

CSS Variables

Copy & paste directly into your stylesheet
:root {
  --color-1: #184C6F;
  --color-2: #1F70CD;
  --color-3: #6B7CD1;
  --color-4: #F8F8F6;
  --color-5: #1D2E51;
}

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
#184C6F on #F8F8F68.58:1
Normal Text AA Pass
Sample Text
#184C6F on #1D2E511.47:1
Large Text Only (Fail)
Sample Text
#1F70CD on #F8F8F64.64:1
Normal Text AA Pass
Sample Text
#1F70CD on #1D2E512.73:1
Large Text Only (Fail)
Sample Text
#6B7CD1 on #F8F8F63.64:1
Large Text Only (Pass)
Sample Text
#6B7CD1 on #1D2E513.48:1
Large Text Only (Pass)

Related Palettes in Modern

Explore Modern
#0F172ACopy
#1E293BCopy
#2563EBCopy
#38BDF8Copy
#F8FAFCCopy
cp-featured-01Technology
SaaS Velocity Blue
TechModernCool
#314E35Copy
#588157Copy
#A3B18ACopy
#FFE6A7Copy
#DDA15ECopy
cp-featured-18Food
Matcha Yuzu Delight
FoodCleanFresh
#FAFAFACopy
#E4E4E7Copy
#71717ACopy
#3F3F46Copy
#18181BCopy
cp-featured-22Minimal
Nordic Monolith
MinimalCleanModern
#4BE2D7Copy
#4AE8DDCopy
#329F98Copy
#6DD5CECopy
#85F4EDCopy
cp-featured-27Aesthetic
Nordic Turquoise Mirage
AestheticCleanOcean