← Back to Editor

#0D4D79 · #0394A5 · #00D4DB · #A9E8DB · #F3EFDF

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarmCool

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial AppData Visualization

Color Details Color Details

#0D4D79

Lake Blue · Teal · Prussian Blue

HEX
#0D4D79
RGB
rgb(13, 77, 121)
HSL
hsl(204, 81%, 26%)
HSB
hsb(204, 89%, 47%)
CMYK
cmyk(89%, 36%, 0%, 53%)
Oklch
oklch(40.6% 0.095 245.2)

Traditional「Lake Blue」· Paint「Prussian Blue」· Creative Blush Sunrise

#0394A5

Lake Blue · LightSeaGreen · Mint Ice

HEX
#0394A5
RGB
rgb(3, 148, 165)
HSL
hsl(186, 96%, 33%)
HSB
hsb(186, 98%, 65%)
CMYK
cmyk(98%, 10%, 0%, 35%)
Oklch
oklch(61.0% 0.105 209.1)

Traditional「Lake Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#00D4DB

Lake Blue · DarkTurquoise · Mint Ice

HEX
#00D4DB
RGB
rgb(0, 212, 219)
HSL
hsl(182, 100%, 43%)
HSB
hsb(182, 100%, 86%)
CMYK
cmyk(100%, 3%, 0%, 14%)
Oklch
oklch(79.0% 0.134 199.0)

Traditional「Lake Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#A9E8DB

Jade · LightBlue · Glacier Blue

HEX
#A9E8DB
RGB
rgb(169, 232, 219)
HSL
hsl(168, 58%, 79%)
HSB
hsb(168, 27%, 91%)
CMYK
cmyk(27%, 0%, 6%, 9%)
Oklch
oklch(88.5% 0.066 180.5)

Traditional「Jade」· Paint「Glacier Blue」· Creative Arctic Pool

#F3EFDF

Goose Yellow · Beige · Lemon Cream

HEX
#F3EFDF
RGB
rgb(243, 239, 223)
HSL
hsl(48, 45%, 91%)
HSB
hsb(48, 8%, 95%)
CMYK
cmyk(0%, 2%, 8%, 5%)
Oklch
oklch(95.1% 0.022 95.3)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

0D4D79
78380D

Analogous

0D786D
0D4D79
0D1778

Triadic

0D4D79
780D4D
4D780D

Split-Comp.

0D4D79
780D17
786D0D

Tetradic

0D4D79
6D0D78
78380D
17780D

Contrast Matrix WCAG 2.1 Contrast

0D4D79
0394A5
00D4DB
A9E8DB
F3EFDF
—
2.5
Fail
4.9
AA
6.5
AA
7.7
AAA
2.5
Fail
—
2.0
Fail
2.6
Fail
3.2
AA Large
4.9
AA
2.0
Fail
—
1.3
Fail
1.6
Fail
6.5
AA
2.6
Fail
1.3
Fail
—
1.2
Fail
7.7
AAA
3.2
AA Large
1.6
Fail
1.2
Fail
—
White BG
8.9AAA
3.6AA Large
1.8Fail
1.4Fail
1.2Fail
Black BG
2.4Fail
5.8AA
11.4AAA
15.3AAA
18.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

29296E
4243A1
5C5ED9
C4C5DE
F1F1E3

Deuteranopia

25206C
392FA0
5040D9
C1BCDF
F2F2E4

Tritanopia

106664
0A9E9D
0BD8D8
ACE1E1
F3E6E7

Achromatopsia

3F3F3F
6B6B6B
959595
D4D4D4
EEEEEE

Shades & Tints Shades & Tints

#0D4D79

Dark
Light

#0394A5

Dark
Light

#00D4DB

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #0d4d79;
  --color-2: #0394a5;
  --color-3: #00d4db;
  --color-4: #a9e8db;
  --color-5: #f3efdf;
}

SCSS

$color-1: #0d4d79;
$color-2: #0394a5;
$color-3: #00d4db;
$color-4: #a9e8db;
$color-5: #f3efdf;

TAILWIND

colors: {
  'brand-1': '#0d4d79',
  'brand-2': '#0394a5',
  'brand-3': '#00d4db',
  'brand-4': '#a9e8db',
  'brand-5': '#f3efdf',
}

RGB Array

[13, 77, 121], [3, 148, 165], [0, 212, 219], [169, 232, 219], [243, 239, 223]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #0D4D79, #0394A5, #00D4DB, #A9E8DB, #F3EFDF is ideal for: social media posters, mobile apps, e-commerce promos, infographics, data visualization, accessible design. Vivid colors effectively attract user attention. High contrast ensures clear visual hierarchy and readability. It is a vibrant and energetic choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #0d4d79; --color-2: #0394a5; --color-3: #00d4db; --color-4: #a9e8db; --color-5: #f3efdf. LangColor editor supports one-click export to CSS, SCSS, Tailwind, JSON and more. Click the "Export" button to choose your format.

What UI/UX design tips apply to this palette?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. High-contrast palettes naturally meet WCAG accessibility standards. Use the "Contrast Matrix" tool in LangColor editor to check WCAG accessibility levels for every color pair.

Which industries or brands suit this palette?

This general-style 5-color scheme is especially suited for food & dining, entertainment, kids education, social industries. Bold colors convey vitality and innovation. Click "AI Analysis" in the editor for more detailed brand color suggestions.

🎨 Open this palette in Editor →

Generated by LangColor online color tool · Breaking the barrier between language and color