← Back to Editor

#04A6A9 · #DED1C6 · #A4DE89 · #F3810F · #FE3905

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

#04A6A9

Lake Blue · LightSeaGreen · Mint Ice

HEX
#04A6A9
RGB
rgb(4, 166, 169)
HSL
hsl(181, 95%, 34%)
HSB
hsb(181, 98%, 66%)
CMYK
cmyk(98%, 2%, 0%, 34%)
Oklch
oklch(65.8% 0.111 197.1)

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

#DED1C6

Apricot · LightGray · Peach Orange

HEX
#DED1C6
RGB
rgb(222, 209, 198)
HSL
hsl(27, 27%, 82%)
HSB
hsb(27, 11%, 87%)
CMYK
cmyk(0%, 6%, 11%, 13%)
Oklch
oklch(86.8% 0.021 62.8)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

#A4DE89

Emerald · LightGreen · Apple Green

HEX
#A4DE89
RGB
rgb(164, 222, 137)
HSL
hsl(101, 56%, 70%)
HSB
hsb(101, 38%, 87%)
CMYK
cmyk(26%, 0%, 38%, 13%)
Oklch
oklch(84.1% 0.128 136.2)

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

#F3810F

Ginger · Orange · Warm Sun

HEX
#F3810F
RGB
rgb(243, 129, 15)
HSL
hsl(30, 90%, 51%)
HSB
hsb(30, 94%, 95%)
CMYK
cmyk(0%, 47%, 94%, 5%)
Oklch
oklch(71.7% 0.173 55.5)

Traditional「Ginger」· Paint「Warm Sun」· Creative Blush Sunrise

#FE3905

Vermilion · OrangeRed · Passion Red

HEX
#FE3905
RGB
rgb(254, 57, 5)
HSL
hsl(13, 99%, 51%)
HSB
hsb(13, 98%, 100%)
CMYK
cmyk(0%, 78%, 98%, 0%)
Oklch
oklch(64.9% 0.236 33.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

04A6A9
A90704

Analogous

04A959
04A6A9
0454A9

Triadic

04A6A9
A904A6
A6A904

Split-Comp.

04A6A9
A90454
A95904

Tetradic

04A6A9
5904A9
A90704
54A904

Contrast Matrix WCAG 2.1 Contrast

04A6A9
DED1C6
A4DE89
F3810F
FE3905
—
2.0
Fail
1.9
Fail
1.1
Fail
1.2
Fail
2.0
Fail
—
1.0
Fail
1.8
Fail
2.4
Fail
1.9
Fail
1.0
Fail
—
1.7
Fail
2.3
Fail
1.1
Fail
1.8
Fail
1.7
Fail
—
1.4
Fail
1.2
Fail
2.4
Fail
2.3
Fail
1.4
Fail
—
White BG
3.0Fail
1.5Fail
1.6Fail
2.6Fail
3.6AA Large
Black BG
7.0AAA
14.0AAA
13.4AAA
8.0AAA
5.8AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

4A4CA8
D8D8C9
BDBE9E
C2C12B
A9A712

Deuteranopia

4135A8
D9DAC9
BAB5A3
C8D131
B4C315

Tritanopia

0CA8A8
DDCBCB
A7AEB1
ED4045
F41C1E

Achromatopsia

767676
D4D4D4
C3C3C3
969696
6E6E6E

Shades & Tints Shades & Tints

#04A6A9

Dark
Light

#DED1C6

Dark
Light

#A4DE89

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #04a6a9;
  --color-2: #ded1c6;
  --color-3: #a4de89;
  --color-4: #f3810f;
  --color-5: #fe3905;
}

SCSS

$color-1: #04a6a9;
$color-2: #ded1c6;
$color-3: #a4de89;
$color-4: #f3810f;
$color-5: #fe3905;

TAILWIND

colors: {
  'brand-1': '#04a6a9',
  'brand-2': '#ded1c6',
  'brand-3': '#a4de89',
  'brand-4': '#f3810f',
  'brand-5': '#fe3905',
}

RGB Array

[4, 166, 169], [222, 209, 198], [164, 222, 137], [243, 129, 15], [254, 57, 5]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #04A6A9, #DED1C6, #A4DE89, #F3810F, #FE3905 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: #04a6a9; --color-2: #ded1c6; --color-3: #a4de89; --color-4: #f3810f; --color-5: #fe3905. 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