← Back to Editor

#0B2442 · #FF2462 · #D5C85B · #EDDEAA · #F4E7D3

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

#0B2442

Indigo · MidnightBlue · Deep Sea Blue

HEX
#0B2442
RGB
rgb(11, 36, 66)
HSL
hsl(213, 71%, 15%)
HSB
hsb(213, 83%, 26%)
CMYK
cmyk(83%, 45%, 0%, 74%)
Oklch
oklch(25.9% 0.064 254.8)

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

#FF2462

Dark Violet · DeepPink · Rose Pink

HEX
#FF2462
RGB
rgb(255, 36, 98)
HSL
hsl(343, 100%, 57%)
HSB
hsb(343, 86%, 100%)
CMYK
cmyk(0%, 86%, 62%, 0%)
Oklch
oklch(64.7% 0.244 13.2)

Traditional「Dark Violet」· Paint「Rose Pink」· Creative Blush Sunrise

#D5C85B

Autumn Sage · BurlyWood · Sunflower

HEX
#D5C85B
RGB
rgb(213, 200, 91)
HSL
hsl(54, 59%, 60%)
HSB
hsb(54, 57%, 84%)
CMYK
cmyk(0%, 6%, 57%, 16%)
Oklch
oklch(82.2% 0.131 102.5)

Traditional「Autumn Sage」· Paint「Sunflower」· Creative Blush Sunrise

#EDDEAA

Goose Yellow · Wheat · Lemon Cream

HEX
#EDDEAA
RGB
rgb(237, 222, 170)
HSL
hsl(47, 65%, 80%)
HSB
hsb(47, 28%, 93%)
CMYK
cmyk(0%, 6%, 28%, 7%)
Oklch
oklch(90.0% 0.069 93.9)

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

#F4E7D3

Goose Yellow · Beige · Peach Orange

HEX
#F4E7D3
RGB
rgb(244, 231, 211)
HSL
hsl(36, 60%, 89%)
HSB
hsb(36, 14%, 96%)
CMYK
cmyk(0%, 5%, 14%, 4%)
Oklch
oklch(93.3% 0.030 78.8)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

0B2442
41290B

Analogous

0B3F41
0B2442
0E0B41

Triadic

0B2442
410B24
24410B

Split-Comp.

0B2442
410E0B
3F410B

Tetradic

0B2442
410B3F
41290B
0B410E

Contrast Matrix WCAG 2.1 Contrast

0B2442
FF2462
D5C85B
EDDEAA
F4E7D3
—
4.2
AA Large
9.1
AAA
11.6
AAA
12.8
AAA
4.2
AA Large
—
2.2
Fail
2.8
Fail
3.0
AA Large
9.1
AAA
2.2
Fail
—
1.3
Fail
1.4
Fail
11.6
AAA
2.8
Fail
1.3
Fail
—
1.1
Fail
12.8
AAA
3.0
AA Large
1.4
Fail
1.1
Fail
—
White BG
15.6AAA
3.7AA Large
1.7Fail
1.3Fail
1.2Fail
Black BG
1.3Fail
5.7AA
12.2AAA
15.6AAA
17.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

16163B
A09E53
CFCF75
E7E6B7
EEEED8

Deuteranopia

141339
ADBD4F
D0D17C
E7E8BA
EFF0D9

Tritanopia

0C3534
F44745
D48A8F
ECC1C3
F3DCDD

Achromatopsia

202020
6D6D6D
BFBFBF
DDDDDD
E9E9E9

Shades & Tints Shades & Tints

#0B2442

Dark
Light

#FF2462

Dark
Light

#D5C85B

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #0b2442;
  --color-2: #ff2462;
  --color-3: #d5c85b;
  --color-4: #eddeaa;
  --color-5: #f4e7d3;
}

SCSS

$color-1: #0b2442;
$color-2: #ff2462;
$color-3: #d5c85b;
$color-4: #eddeaa;
$color-5: #f4e7d3;

TAILWIND

colors: {
  'brand-1': '#0b2442',
  'brand-2': '#ff2462',
  'brand-3': '#d5c85b',
  'brand-4': '#eddeaa',
  'brand-5': '#f4e7d3',
}

RGB Array

[11, 36, 66], [255, 36, 98], [213, 200, 91], [237, 222, 170], [244, 231, 211]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #0B2442, #FF2462, #D5C85B, #EDDEAA, #F4E7D3 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: #0b2442; --color-2: #ff2462; --color-3: #d5c85b; --color-4: #eddeaa; --color-5: #f4e7d3. 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