← Back to Editor

#1F2247 · #073B52 · #45594D · #9E8C87 · #EBC7AB

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#1F2247

Indigo · MidnightBlue · Deep Sea Blue

HEX
#1F2247
RGB
rgb(31, 34, 71)
HSL
hsl(236, 39%, 20%)
HSB
hsb(236, 56%, 28%)
CMYK
cmyk(56%, 52%, 0%, 72%)
Oklch
oklch(27.1% 0.068 277.3)

Traditional「Indigo」· Paint「Deep Sea Blue」· Creative Blush Sunrise

#073B52

Lake Blue · DarkSlateGray · Peacock Green

HEX
#073B52
RGB
rgb(7, 59, 82)
HSL
hsl(198, 84%, 17%)
HSB
hsb(198, 91%, 32%)
CMYK
cmyk(91%, 28%, 0%, 68%)
Oklch
oklch(33.3% 0.065 233.7)

Traditional「Lake Blue」· Paint「Peacock Green」· Creative Blush Sunrise

#45594D

Celadon · DarkSlateGray · Forest Green

HEX
#45594D
RGB
rgb(69, 89, 77)
HSL
hsl(144, 13%, 31%)
HSB
hsb(144, 22%, 35%)
CMYK
cmyk(22%, 0%, 13%, 65%)
Oklch
oklch(44.3% 0.031 158.5)

Traditional「Celadon」· Paint「Forest Green」· Creative Blush Sunrise

#9E8C87

Crimson · Gray · Passion Red

HEX
#9E8C87
RGB
rgb(158, 140, 135)
HSL
hsl(13, 11%, 57%)
HSB
hsb(13, 15%, 62%)
CMYK
cmyk(0%, 11%, 15%, 38%)
Oklch
oklch(65.5% 0.023 36.0)

Traditional「Crimson」· Paint「Passion Red」· Creative Blush Sunrise

#EBC7AB

Apricot · Wheat · Peach Orange

HEX
#EBC7AB
RGB
rgb(235, 199, 171)
HSL
hsl(26, 62%, 80%)
HSB
hsb(26, 27%, 92%)
CMYK
cmyk(0%, 15%, 27%, 8%)
Oklch
oklch(85.3% 0.056 59.8)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

1F2247
47441F

Analogous

1F3647
1F2247
301F47

Triadic

1F2247
471F22
22471F

Split-Comp.

1F2247
47301F
36471F

Tetradic

1F2247
471F36
47441F
1F4730

Contrast Matrix WCAG 2.1 Contrast

1F2247
073B52
45594D
9E8C87
EBC7AB
—
1.3
Fail
2.0
Fail
4.8
AA
9.6
AAA
1.3
Fail
—
1.6
Fail
3.7
AA Large
7.6
AAA
2.0
Fail
1.6
Fail
—
2.4
Fail
4.8
AA
4.8
AA
3.7
AA Large
2.4
Fail
—
2.0
Fail
9.6
AAA
7.6
AAA
4.8
AA
2.0
Fail
—
White BG
15.2AAA
12.0AAA
7.5AAA
3.2AA Large
1.6Fail
Black BG
1.4Fail
1.8Fail
2.8Fail
6.6AA
13.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

20203E
1E1E4C
4E4E50
969688
DBDBB2

Deuteranopia

20203C
1B174B
4D4B51
979989
DEE0B3

Tritanopia

1F3735
0A4847
465253
9D8989
E9B7B8

Achromatopsia

252525
2E2E2E
525252
919191
CFCFCF

Shades & Tints Shades & Tints

#1F2247

Dark
Light

#073B52

Dark
Light

#45594D

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #1f2247;
  --color-2: #073b52;
  --color-3: #45594d;
  --color-4: #9e8c87;
  --color-5: #ebc7ab;
}

SCSS

$color-1: #1f2247;
$color-2: #073b52;
$color-3: #45594d;
$color-4: #9e8c87;
$color-5: #ebc7ab;

TAILWIND

colors: {
  'brand-1': '#1f2247',
  'brand-2': '#073b52',
  'brand-3': '#45594d',
  'brand-4': '#9e8c87',
  'brand-5': '#ebc7ab',
}

RGB Array

[31, 34, 71], [7, 59, 82], [69, 89, 77], [158, 140, 135], [235, 199, 171]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #1F2247, #073B52, #45594D, #9E8C87, #EBC7AB is ideal for: infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. It is a balanced and harmonious choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #1f2247; --color-2: #073b52; --color-3: #45594d; --color-4: #9e8c87; --color-5: #ebc7ab. 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 tech, SaaS, healthcare, eco industries. 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