← Back to Editor

#01234F · #364E58 · #8B9D17 · #F3F9AF · #D2110A

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

#01234F

Indigo · MidnightBlue · Deep Sea Blue

HEX
#01234F
RGB
rgb(1, 35, 79)
HSL
hsl(214, 98%, 16%)
HSB
hsb(214, 99%, 31%)
CMYK
cmyk(99%, 56%, 0%, 69%)
Oklch
oklch(26.3% 0.090 256.6)

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

#364E58

Slate Blue · DarkSlateGray · Mint Ice

HEX
#364E58
RGB
rgb(54, 78, 88)
HSL
hsl(198, 24%, 28%)
HSB
hsb(198, 39%, 35%)
CMYK
cmyk(39%, 11%, 0%, 65%)
Oklch
oklch(40.8% 0.034 225.7)

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

#8B9D17

Autumn Sage · Olive · Honey Gold

HEX
#8B9D17
RGB
rgb(139, 157, 23)
HSL
hsl(68, 74%, 35%)
HSB
hsb(68, 85%, 62%)
CMYK
cmyk(11%, 0%, 85%, 38%)
Oklch
oklch(65.9% 0.147 117.8)

Traditional「Autumn Sage」· Paint「Honey Gold」· Creative Blush Sunrise

#F3F9AF

Fresh Green · Wheat · Lemon Cream

HEX
#F3F9AF
RGB
rgb(243, 249, 175)
HSL
hsl(65, 86%, 83%)
HSB
hsb(65, 30%, 98%)
CMYK
cmyk(2%, 0%, 30%, 2%)
Oklch
oklch(96.0% 0.094 111.9)

Traditional「Fresh Green」· Paint「Lemon Cream」· Creative Lemon Fizz

#D2110A

Vermilion · FireBrick · Passion Red

HEX
#D2110A
RGB
rgb(210, 17, 10)
HSL
hsl(2, 91%, 43%)
HSB
hsb(2, 95%, 82%)
CMYK
cmyk(0%, 92%, 95%, 18%)
Oklch
oklch(54.7% 0.218 29.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

01234F
512E01

Analogous

014B51
01234F
060151

Triadic

01234F
510123
235101

Split-Comp.

01234F
510601
4B5101

Tetradic

01234F
51014B
512E01
015106

Contrast Matrix WCAG 2.1 Contrast

01234F
364E58
8B9D17
F3F9AF
D2110A
—
1.8
Fail
5.1
AA
14.0
AAA
2.8
Fail
1.8
Fail
—
2.9
Fail
7.9
AAA
1.6
Fail
5.1
AA
2.9
Fail
—
2.7
Fail
1.8
Fail
14.0
AAA
7.9
AAA
2.7
Fail
—
5.0
AA
2.8
Fail
1.6
Fail
1.8
Fail
5.0
AA
—
White BG
15.5AAA
8.8AAA
3.0AA Large
1.1Fail
5.5AA
Black BG
1.4Fail
2.4Fail
6.9AA
19.0AAA
3.8AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

101044
404156
939337
F6F6C1
7E7D0C

Deuteranopia

0E0B42
3F3D55
92903F
F5F5C5
8A980C

Tritanopia

033C3A
375453
8C5157
F3CFD2
C80D0D

Achromatopsia

1E1E1E
484848
888888
EFEFEF
4A4A4A

Shades & Tints Shades & Tints

#01234F

Dark
Light

#364E58

Dark
Light

#8B9D17

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #01234f;
  --color-2: #364e58;
  --color-3: #8b9d17;
  --color-4: #f3f9af;
  --color-5: #d2110a;
}

SCSS

$color-1: #01234f;
$color-2: #364e58;
$color-3: #8b9d17;
$color-4: #f3f9af;
$color-5: #d2110a;

TAILWIND

colors: {
  'brand-1': '#01234f',
  'brand-2': '#364e58',
  'brand-3': '#8b9d17',
  'brand-4': '#f3f9af',
  'brand-5': '#d2110a',
}

RGB Array

[1, 35, 79], [54, 78, 88], [139, 157, 23], [243, 249, 175], [210, 17, 10]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #01234F, #364E58, #8B9D17, #F3F9AF, #D2110A 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: #01234f; --color-2: #364e58; --color-3: #8b9d17; --color-4: #f3f9af; --color-5: #d2110a. 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