← Back to Editor

#2D2816 · #08AA9D · #A7BA50 · #DBA828 · #D73014

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 App

Color Details Color Details

#2D2816

Ochre · Black · Amber Gold

HEX
#2D2816
RGB
rgb(45, 40, 22)
HSL
hsl(47, 34%, 13%)
HSB
hsb(47, 51%, 18%)
CMYK
cmyk(0%, 11%, 51%, 82%)
Oklch
oklch(27.7% 0.031 94.4)

Traditional「Ochre」· Paint「Amber Gold」· Creative Blush Sunrise

#08AA9D

Mineral Blue · LightSeaGreen · Mint Ice

HEX
#08AA9D
RGB
rgb(8, 170, 157)
HSL
hsl(175, 91%, 35%)
HSB
hsb(175, 95%, 67%)
CMYK
cmyk(95%, 0%, 8%, 33%)
Oklch
oklch(66.4% 0.116 185.2)

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

#A7BA50

Grass Green · DarkSeaGreen · Olive Green

HEX
#A7BA50
RGB
rgb(167, 186, 80)
HSL
hsl(71, 43%, 52%)
HSB
hsb(71, 57%, 73%)
CMYK
cmyk(10%, 0%, 57%, 27%)
Oklch
oklch(75.3% 0.133 118.2)

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

#DBA828

Ginger · GoldenRod · Sunflower

HEX
#DBA828
RGB
rgb(219, 168, 40)
HSL
hsl(43, 71%, 51%)
HSB
hsb(43, 82%, 86%)
CMYK
cmyk(0%, 23%, 82%, 14%)
Oklch
oklch(75.9% 0.145 84.7)

Traditional「Ginger」· Paint「Sunflower」· Creative Blush Sunrise

#D73014

Vermilion · FireBrick · Passion Red

HEX
#D73014
RGB
rgb(215, 48, 20)
HSL
hsl(9, 83%, 46%)
HSB
hsb(9, 91%, 84%)
CMYK
cmyk(0%, 78%, 91%, 16%)
Oklch
oklch(57.4% 0.206 31.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

2D2816
161B2C

Analogous

2C1C16
2D2816
262C16

Triadic

2D2816
162C28
28162C

Split-Comp.

2D2816
16262C
1C162C

Tetradic

2D2816
162C1C
161B2C
2C1626

Contrast Matrix WCAG 2.1 Contrast

2D2816
08AA9D
A7BA50
DBA828
D73014
—
5.1
AA
6.9
AA
6.8
AA
3.0
AA Large
5.1
AA
—
1.3
Fail
1.3
Fail
1.7
Fail
6.9
AA
1.3
Fail
—
1.0
Fail
2.3
Fail
6.8
AA
1.3
Fail
1.0
Fail
—
2.2
Fail
3.0
AA Large
1.7
Fail
2.3
Fail
2.2
Fail
—
White BG
14.7AAA
2.9Fail
2.1Fail
2.2Fail
4.9AA
Black BG
1.4Fail
7.2AAA
9.8AAA
9.6AAA
4.3AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

2B2B1A
4E50A0
AFAF6A
C5C447
8F8D1B

Deuteranopia

2B2C1B
4539A1
AEAD70
C8CC4E
98A51C

Tritanopia

2D1E1F
10A3A3
A87E82
D85F65
CF2021

Achromatopsia

272727
787878
A8A8A8
A9A9A9
5F5F5F

Shades & Tints Shades & Tints

#2D2816

Dark
Light

#08AA9D

Dark
Light

#A7BA50

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #2d2816;
  --color-2: #08aa9d;
  --color-3: #a7ba50;
  --color-4: #dba828;
  --color-5: #d73014;
}

SCSS

$color-1: #2d2816;
$color-2: #08aa9d;
$color-3: #a7ba50;
$color-4: #dba828;
$color-5: #d73014;

TAILWIND

colors: {
  'brand-1': '#2d2816',
  'brand-2': '#08aa9d',
  'brand-3': '#a7ba50',
  'brand-4': '#dba828',
  'brand-5': '#d73014',
}

RGB Array

[45, 40, 22], [8, 170, 157], [167, 186, 80], [219, 168, 40], [215, 48, 20]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #2D2816, #08AA9D, #A7BA50, #DBA828, #D73014 is ideal for: social media posters, mobile apps, e-commerce promos, tech websites, dark mode UIs, game UIs. Vivid colors effectively attract user attention. 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: #2d2816; --color-2: #08aa9d; --color-3: #a7ba50; --color-4: #dba828; --color-5: #d73014. 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?

Dark tones work well as backgrounds; pair with light text for readability. Use the brightest color for CTA buttons and interactive elements. 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