#C9A71E + #1E294D + #2A396B + #30458C + #2F49A1 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#C9A71E

Ochre · GoldenRod · Honey Gold

HEX

#C9A71E

RGB

rgb(201, 167, 30)

HSL

hsl(48, 74%, 45%)

HSB

hsb(48, 85%, 79%)

CMYK

cmyk(0%, 17%, 85%, 21%)

Oklch

oklch(73.8% 0.144 93.3)

Traditional「Ochre」· Paint「Honey Gold」· Creative Blush Sunrise

#1E294D

Indigo · MidnightBlue · Prussian Blue

HEX

#1E294D

RGB

rgb(30, 41, 77)

HSL

hsl(226, 44%, 21%)

HSB

hsb(226, 61%, 30%)

CMYK

cmyk(61%, 47%, 0%, 70%)

Oklch

oklch(29.1% 0.067 269.1)

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

#2A396B

Indigo · DarkSlateGray · Prussian Blue

HEX

#2A396B

RGB

rgb(42, 57, 107)

HSL

hsl(226, 44%, 29%)

HSB

hsb(226, 61%, 42%)

CMYK

cmyk(61%, 47%, 0%, 58%)

Oklch

oklch(35.9% 0.089 269.0)

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

#30458C

Indigo · DarkSlateBlue · Prussian Blue

HEX

#30458C

RGB

rgb(48, 69, 140)

HSL

hsl(226, 49%, 37%)

HSB

hsb(226, 66%, 55%)

CMYK

cmyk(66%, 51%, 0%, 45%)

Oklch

oklch(41.4% 0.120 268.4)

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

#2F49A1

Indigo · DarkSlateBlue · Navy Blue

HEX

#2F49A1

RGB

rgb(47, 73, 161)

HSL

hsl(226, 55%, 41%)

HSB

hsb(226, 71%, 63%)

CMYK

cmyk(71%, 55%, 0%, 37%)

Oklch

oklch(43.8% 0.146 267.6)

Traditional「Indigo」· Paint「Navy Blue」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C9A71E

1E40C8

Analogous

C8511E

C9A71E

95C81E

Triadic

C9A71E

1EC8A6

A61EC8

Split-Comp.

C9A71E

1E95C8

511EC8

Tetradic

C9A71E

1EC851

1E40C8

C81E95

Contrast Matrix WCAG 2.1 Contrast

C9A71E	1E294D	2A396B	30458C	2F49A1
—	6.1 AA	4.8 AA	3.8 AA Large	3.5 AA Large
6.1 AA	—	1.3 Fail	1.6 Fail	1.7 Fail
4.8 AA	1.3 Fail	—	1.2 Fail	1.4 Fail
3.8 AA Large	1.6 Fail	1.2 Fail	—	1.1 Fail
3.5 AA Large	1.7 Fail	1.4 Fail	1.1 Fail	—

White BG

2.3Fail

14.2AAA

11.1AAA

8.9AAA

8.1AAA

Black BG

9.0AAA

1.5Fail

1.9Fail

2.4Fail

2.6Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

BABA3F

232344

30315F

39397B

3A3A8C

Deuteranopia

BCBF47

222142

302F5C

383677

393787

Tritanopia

C7595F

1F3D3C

2B5553

316D6A

307B77

Achromatopsia

A2A2A2

2A2A2A

3A3A3A

474747

4B4B4B

Shades & Tints Shades & Tints

#C9A71E

Dark

Light

#1E294D

Dark

Light

#2A396B

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c9a71e;
  --color-2: #1e294d;
  --color-3: #2a396b;
  --color-4: #30458c;
  --color-5: #2f49a1;
}

SCSS

$color-1: #c9a71e;
$color-2: #1e294d;
$color-3: #2a396b;
$color-4: #30458c;
$color-5: #2f49a1;

TAILWIND

colors: {
  'brand-1': '#c9a71e',
  'brand-2': '#1e294d',
  'brand-3': '#2a396b',
  'brand-4': '#30458c',
  'brand-5': '#2f49a1',
}

RGB Array

[201, 167, 30], [30, 41, 77], [42, 57, 107], [48, 69, 140], [47, 73, 161]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #C9A71E, #1E294D, #2A396B, #30458C, #2F49A1 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: #c9a71e; --color-2: #1e294d; --color-3: #2a396b; --color-4: #30458c; --color-5: #2f49a1. 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