← Back to Editor

#124E58 · #95BB70 · #FFB83F · #E02F0D · #E8DBAF

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

#124E58

Lake Blue · DarkSlateGray · Peacock Green

HEX
#124E58
RGB
rgb(18, 78, 88)
HSL
hsl(189, 66%, 21%)
HSB
hsb(189, 80%, 35%)
CMYK
cmyk(80%, 11%, 0%, 65%)
Oklch
oklch(39.2% 0.061 211.3)

Traditional「Lake Blue」· Paint「Peacock Green」· Creative Blush Sunrise

#95BB70

Celadon · DarkSeaGreen · Olive Green

HEX
#95BB70
RGB
rgb(149, 187, 112)
HSL
hsl(90, 36%, 59%)
HSB
hsb(90, 40%, 73%)
CMYK
cmyk(20%, 0%, 40%, 27%)
Oklch
oklch(74.6% 0.110 130.6)

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

#FFB83F

Ginger · SandyBrown · Warm Sun

HEX
#FFB83F
RGB
rgb(255, 184, 63)
HSL
hsl(38, 100%, 62%)
HSB
hsb(38, 75%, 100%)
CMYK
cmyk(0%, 28%, 75%, 0%)
Oklch
oklch(82.9% 0.153 76.4)

Traditional「Ginger」· Paint「Warm Sun」· Creative Honey Glow

#E02F0D

Vermilion · OrangeRed · Passion Red

HEX
#E02F0D
RGB
rgb(224, 47, 13)
HSL
hsl(10, 89%, 46%)
HSB
hsb(10, 94%, 88%)
CMYK
cmyk(0%, 79%, 94%, 12%)
Oklch
oklch(58.9% 0.216 32.2)

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

#E8DBAF

Goose Yellow · Wheat · Lemon Cream

HEX
#E8DBAF
RGB
rgb(232, 219, 175)
HSL
hsl(46, 55%, 80%)
HSB
hsb(46, 25%, 91%)
CMYK
cmyk(0%, 6%, 25%, 9%)
Oklch
oklch(89.1% 0.059 93.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

124E58
591D12

Analogous

125940
124E58
122B59

Triadic

124E58
59124E
4E5912

Split-Comp.

124E58
59122B
594012

Tetradic

124E58
401259
591D12
2B5912

Contrast Matrix WCAG 2.1 Contrast

124E58
95BB70
FFB83F
E02F0D
E8DBAF
—
4.3
AA Large
5.4
AA
2.0
Fail
6.7
AA
4.3
AA Large
—
1.3
Fail
2.1
Fail
1.6
Fail
5.4
AA
1.3
Fail
—
2.7
Fail
1.2
Fail
2.0
Fail
2.1
Fail
2.7
Fail
—
3.3
AA Large
6.7
AA
1.6
Fail
1.2
Fail
3.3
AA Large
—
White BG
9.3AAA
2.2Fail
1.7Fail
4.6AA
1.4Fail
Black BG
2.3Fail
9.6AAA
12.2AAA
4.6AA
15.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

2C2D56
A5A682
E0E05C
939215
E2E2BA

Deuteranopia

292455
A3A087
E4EA63
9EAB17
E3E4BC

Tritanopia

155453
979094
FB7378
D71C1D
E7C2C4

Achromatopsia

3D3D3D
A7A7A7
BFBFBF
606060
DADADA

Shades & Tints Shades & Tints

#124E58

Dark
Light

#95BB70

Dark
Light

#FFB83F

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #124e58;
  --color-2: #95bb70;
  --color-3: #ffb83f;
  --color-4: #e02f0d;
  --color-5: #e8dbaf;
}

SCSS

$color-1: #124e58;
$color-2: #95bb70;
$color-3: #ffb83f;
$color-4: #e02f0d;
$color-5: #e8dbaf;

TAILWIND

colors: {
  'brand-1': '#124e58',
  'brand-2': '#95bb70',
  'brand-3': '#ffb83f',
  'brand-4': '#e02f0d',
  'brand-5': '#e8dbaf',
}

RGB Array

[18, 78, 88], [149, 187, 112], [255, 184, 63], [224, 47, 13], [232, 219, 175]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #124E58, #95BB70, #FFB83F, #E02F0D, #E8DBAF 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: #124e58; --color-2: #95bb70; --color-3: #ffb83f; --color-4: #e02f0d; --color-5: #e8dbaf. 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