← Back to Editor

#009AB3 · #453A30 · #A8B910 · #BECB43 · #DBE866

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

#009AB3

Lake Blue · LightSeaGreen · Mint Ice

HEX
#009AB3
RGB
rgb(0, 154, 179)
HSL
hsl(188, 100%, 35%)
HSB
hsb(188, 100%, 70%)
CMYK
cmyk(100%, 14%, 0%, 30%)
Oklch
oklch(63.1% 0.111 214.6)

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

#453A30

Tangerine · DarkSlateGray · Cinnamon

HEX
#453A30
RGB
rgb(69, 58, 48)
HSL
hsl(29, 18%, 23%)
HSB
hsb(29, 30%, 27%)
CMYK
cmyk(0%, 16%, 30%, 73%)
Oklch
oklch(35.7% 0.023 64.3)

Traditional「Tangerine」· Paint「Cinnamon」· Creative Blush Sunrise

#A8B910

Autumn Sage · DarkGoldenRod · Honey Gold

HEX
#A8B910
RGB
rgb(168, 185, 16)
HSL
hsl(66, 84%, 39%)
HSB
hsb(66, 91%, 73%)
CMYK
cmyk(9%, 0%, 91%, 27%)
Oklch
oklch(74.7% 0.168 116.3)

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

#BECB43

Autumn Sage · GreenYellow · Sunflower

HEX
#BECB43
RGB
rgb(190, 203, 67)
HSL
hsl(66, 57%, 53%)
HSB
hsb(66, 67%, 80%)
CMYK
cmyk(6%, 0%, 67%, 20%)
Oklch
oklch(80.7% 0.157 114.6)

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

#DBE866

Fresh Green · Khaki · Sunflower

HEX
#DBE866
RGB
rgb(219, 232, 102)
HSL
hsl(66, 74%, 65%)
HSB
hsb(66, 56%, 91%)
CMYK
cmyk(6%, 0%, 56%, 9%)
Oklch
oklch(89.6% 0.154 114.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

009AB3
B31800

Analogous

00B371
009AB3
0041B3

Triadic

009AB3
B3009B
9BB300

Split-Comp.

009AB3
B30041
B37100

Tetradic

009AB3
7100B3
B31800
41B300

Contrast Matrix WCAG 2.1 Contrast

009AB3
453A30
A8B910
BECB43
DBE866
—
3.3
AA Large
1.5
Fail
1.9
Fail
2.5
Fail
3.3
AA Large
—
5.1
AA
6.2
AA
8.3
AAA
1.5
Fail
5.1
AA
—
1.2
Fail
1.6
Fail
1.9
Fail
6.2
AA
1.2
Fail
—
1.3
Fail
2.5
Fail
8.3
AAA
1.6
Fail
1.3
Fail
—
White BG
3.3AA Large
11.0AAA
2.2Fail
1.8Fail
1.3Fail
Black BG
6.3AA
1.9Fail
9.6AAA
11.8AAA
15.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

4344AD
404032
AFB039
C4C464
E1E185

Deuteranopia

3A2EAC
414233
AEAD43
C3C26C
E0DF8D

Tritanopia

08A8A7
443435
A95960
BF7E84
DC9EA4

Achromatopsia

6F6F6F
3C3C3C
A1A1A1
B8B8B8
D5D5D5

Shades & Tints Shades & Tints

#009AB3

Dark
Light

#453A30

Dark
Light

#A8B910

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #009ab3;
  --color-2: #453a30;
  --color-3: #a8b910;
  --color-4: #becb43;
  --color-5: #dbe866;
}

SCSS

$color-1: #009ab3;
$color-2: #453a30;
$color-3: #a8b910;
$color-4: #becb43;
$color-5: #dbe866;

TAILWIND

colors: {
  'brand-1': '#009ab3',
  'brand-2': '#453a30',
  'brand-3': '#a8b910',
  'brand-4': '#becb43',
  'brand-5': '#dbe866',
}

RGB Array

[0, 154, 179], [69, 58, 48], [168, 185, 16], [190, 203, 67], [219, 232, 102]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #009AB3, #453A30, #A8B910, #BECB43, #DBE866 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: #009ab3; --color-2: #453a30; --color-3: #a8b910; --color-4: #becb43; --color-5: #dbe866. 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