← Back to Editor

#002E4B · #DB4F60 · #D4AE55 · #B4CF9F · #E3D2A1

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

#002E4B

Lake Blue · MidnightBlue · Deep Sea Blue

HEX
#002E4B
RGB
rgb(0, 46, 75)
HSL
hsl(203, 100%, 15%)
HSB
hsb(203, 100%, 29%)
CMYK
cmyk(100%, 39%, 0%, 71%)
Oklch
oklch(28.9% 0.070 243.2)

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

#DB4F60

Vermilion · Tomato · Passion Red

HEX
#DB4F60
RGB
rgb(219, 79, 96)
HSL
hsl(353, 66%, 58%)
HSB
hsb(353, 64%, 86%)
CMYK
cmyk(0%, 64%, 56%, 14%)
Oklch
oklch(62.1% 0.175 16.7)

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

#D4AE55

Ginger · SandyBrown · Sunflower

HEX
#D4AE55
RGB
rgb(212, 174, 85)
HSL
hsl(42, 60%, 58%)
HSB
hsb(42, 60%, 83%)
CMYK
cmyk(0%, 18%, 60%, 17%)
Oklch
oklch(76.7% 0.116 86.3)

Traditional「Ginger」· Paint「Sunflower」· Creative Blush Sunrise

#B4CF9F

Celadon · Silver · Apple Green

HEX
#B4CF9F
RGB
rgb(180, 207, 159)
HSL
hsl(94, 33%, 72%)
HSB
hsb(94, 23%, 81%)
CMYK
cmyk(13%, 0%, 23%, 19%)
Oklch
oklch(82.2% 0.071 131.7)

Traditional「Celadon」· Paint「Apple Green」· Creative Mint Breeze

#E3D2A1

Goose Yellow · Wheat · Lemon Cream

HEX
#E3D2A1
RGB
rgb(227, 210, 161)
HSL
hsl(45, 54%, 76%)
HSB
hsb(45, 29%, 89%)
CMYK
cmyk(0%, 7%, 29%, 11%)
Oklch
oklch(86.6% 0.067 91.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

002E4B
4D1D00

Analogous

004D44
002E4B
00094D

Triadic

002E4B
4D002F
2F4D00

Split-Comp.

002E4B
4D0009
4D4400

Tetradic

002E4B
44004D
4D1D00
094D00

Contrast Matrix WCAG 2.1 Contrast

002E4B
DB4F60
D4AE55
B4CF9F
E3D2A1
—
3.6
AA Large
6.7
AA
8.3
AAA
9.4
AAA
3.6
AA Large
—
1.9
Fail
2.3
Fail
2.6
Fail
6.7
AA
1.9
Fail
—
1.2
Fail
1.4
Fail
8.3
AAA
2.3
Fail
1.2
Fail
—
1.1
Fail
9.4
AAA
2.6
Fail
1.4
Fail
1.1
Fail
—
White BG
14.1AAA
4.0AA Large
2.1Fail
1.7Fail
1.5Fail
Black BG
1.5Fail
5.3AA
10.0AAA
12.4AAA
14.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

141444
9E9D5C
C4C36B
C0C0AB
DCDBAD

Deuteranopia

110E42
A7B15B
C6C970
BEBCAD
DDDEB0

Tritanopia

023E3D
D45958
D27C7F
B5B4B6
E2B6B8

Achromatopsia

242424
7B7B7B
AFAFAF
C1C1C1
D1D1D1

Shades & Tints Shades & Tints

#002E4B

Dark
Light

#DB4F60

Dark
Light

#D4AE55

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #002e4b;
  --color-2: #db4f60;
  --color-3: #d4ae55;
  --color-4: #b4cf9f;
  --color-5: #e3d2a1;
}

SCSS

$color-1: #002e4b;
$color-2: #db4f60;
$color-3: #d4ae55;
$color-4: #b4cf9f;
$color-5: #e3d2a1;

TAILWIND

colors: {
  'brand-1': '#002e4b',
  'brand-2': '#db4f60',
  'brand-3': '#d4ae55',
  'brand-4': '#b4cf9f',
  'brand-5': '#e3d2a1',
}

RGB Array

[0, 46, 75], [219, 79, 96], [212, 174, 85], [180, 207, 159], [227, 210, 161]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #002E4B, #DB4F60, #D4AE55, #B4CF9F, #E3D2A1 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: #002e4b; --color-2: #db4f60; --color-3: #d4ae55; --color-4: #b4cf9f; --color-5: #e3d2a1. 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