#0D2355 + #178392 + #4B9679 + #809F3B + #667A16 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#0D2355

Indigo · MidnightBlue · Deep Sea Blue

HEX

#0D2355

RGB

rgb(13, 35, 85)

HSL

hsl(222, 73%, 19%)

HSB

hsb(222, 85%, 33%)

CMYK

cmyk(85%, 59%, 0%, 67%)

Oklch

oklch(27.3% 0.095 263.5)

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

#178392

Lake Blue · Teal · Mint Ice

HEX

#178392

RGB

rgb(23, 131, 146)

HSL

hsl(187, 73%, 33%)

HSB

hsb(187, 84%, 57%)

CMYK

cmyk(84%, 10%, 0%, 43%)

Oklch

oklch(56.1% 0.092 209.6)

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

#4B9679

Mineral Blue · MediumSeaGreen · Olive Green

HEX

#4B9679

RGB

rgb(75, 150, 121)

HSL

hsl(157, 33%, 44%)

HSB

hsb(157, 50%, 59%)

CMYK

cmyk(50%, 0%, 19%, 41%)

Oklch

oklch(61.6% 0.088 166.1)

Traditional「Mineral Blue」· Paint「Olive Green」· Creative Blush Sunrise

#809F3B

Grass Green · Olive · Olive Green

HEX

#809F3B

RGB

rgb(128, 159, 59)

HSL

hsl(79, 46%, 43%)

HSB

hsb(79, 63%, 62%)

CMYK

cmyk(19%, 0%, 63%, 38%)

Oklch

oklch(65.8% 0.132 124.6)

Traditional「Grass Green」· Paint「Olive Green」· Creative Blush Sunrise

#667A16

Grass Green · DarkOliveGreen · Forest Green

HEX

#667A16

RGB

rgb(102, 122, 22)

HSL

hsl(72, 69%, 28%)

HSB

hsb(72, 82%, 48%)

CMYK

cmyk(16%, 0%, 82%, 52%)

Oklch

oklch(54.5% 0.122 120.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

0D2355

543F0D

Analogous

0D4654

0D2355

1B0D54

Triadic

0D2355

540D22

22540D

Split-Comp.

0D2355

541B0D

46540D

Tetradic

0D2355

540D46

543F0D

0D541B

Contrast Matrix WCAG 2.1 Contrast

0D2355	178392	4B9679	809F3B	667A16
—	3.4 AA Large	4.3 AA Large	5.0 AA	3.1 AA Large
3.4 AA Large	—	1.3 Fail	1.5 Fail	1.1 Fail
4.3 AA Large	1.3 Fail	—	1.2 Fail	1.4 Fail
5.0 AA	1.5 Fail	1.2 Fail	—	1.6 Fail
3.1 AA Large	1.1 Fail	1.4 Fail	1.6 Fail	—

White BG

15.1AAA

4.5AA Large

3.5AA Large

3.0AA Large

4.8AA

Black BG

1.4Fail

4.7AA

5.9AA

6.9AA

4.4AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

171749

46478E

6B6C80

8D8E53

6F6F2E

Deuteranopia

151446

40378E

676282

8C8959

6E6C34

Tritanopia

0E3F3D

1C8C8B

4F8687

82666B

674146

Achromatopsia

222222

646464

7C7C7C

8A8A8A

696969

Shades & Tints Shades & Tints

#0D2355

Dark

Light

#178392

Dark

Light

#4B9679

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #0d2355;
  --color-2: #178392;
  --color-3: #4b9679;
  --color-4: #809f3b;
  --color-5: #667a16;
}

SCSS

$color-1: #0d2355;
$color-2: #178392;
$color-3: #4b9679;
$color-4: #809f3b;
$color-5: #667a16;

TAILWIND

colors: {
  'brand-1': '#0d2355',
  'brand-2': '#178392',
  'brand-3': '#4b9679',
  'brand-4': '#809f3b',
  'brand-5': '#667a16',
}

RGB Array

[13, 35, 85], [23, 131, 146], [75, 150, 121], [128, 159, 59], [102, 122, 22]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #0D2355, #178392, #4B9679, #809F3B, #667A16 is ideal for: tech websites, dark mode UIs, game UIs. 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: #0d2355; --color-2: #178392; --color-3: #4b9679; --color-4: #809f3b; --color-5: #667a16. 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?

Dark tones work well as backgrounds; pair with light text for readability. Use the brightest color for CTA buttons and interactive elements. 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