ColorPaletteXYZ Logo
ColorPaletteXYZ
Palettes/App UI

Travel Azure Horizon

Breezy travel booking and flight reservation interface palette evoking expansive blue skies and open waters.

#App UI#Ocean#UI#Fresh#Cool
Open in Generator
COLOR 1
#0C4A6E
Aegean Sea
COLOR 2
#0284C7
Polaroid Film Cyan
COLOR 3
#38BDF8
Deep Sky Blue
COLOR 4
#BAE6FD
Baby Blue Soft
COLOR 5
#F0F9FF
Alice Blue

Color Values & Codes

HEX · RGB · HSL
Aegean Sea
#0C4A6E
rgb(12, 74, 110)hsl(202, 80%, 24%)Color details →
rgb(2, 132, 199)hsl(200, 98%, 39%)Color details →
rgb(56, 189, 248)hsl(198, 93%, 60%)Color details →
rgb(186, 230, 253)hsl(201, 94%, 86%)Color details →
Alice Blue
#F0F9FF
rgb(240, 249, 255)hsl(204, 100%, 97%)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: #0C4A6E;
  --color-2: #0284C7;
  --color-3: #38BDF8;
  --color-4: #BAE6FD;
  --color-5: #F0F9FF;
}

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
#0C4A6E on #BAE6FD7.13:1
Normal Text AA Pass
Sample Text
#0C4A6E on #F0F9FF8.87:1
Normal Text AA Pass
Sample Text
#0284C7 on #BAE6FD3.09:1
Large Text Only (Pass)
Sample Text
#0284C7 on #F0F9FF3.84:1
Large Text Only (Pass)
Sample Text
#38BDF8 on #BAE6FD1.61:1
Large Text Only (Fail)
Sample Text
#38BDF8 on #F0F9FF2.01:1
Large Text Only (Fail)

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
#020B14Copy
#06283DCopy
#1363DFCopy
#47B5FFCopy
#DFF6FFCopy
cp-featured-08Ocean
Marianas Deep Sea
OceanCool
#005F73Copy
#0A9396Copy
#94D2BDCopy
#E9D8A6Copy
#EE9B00Copy
cp-featured-13Ocean
Caribbean Reef Shallows
OceanFresh