← Back to Editor

#F0DA8E · #A08117 · #7A382C · #3C0C29 · #16130C

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#F0DA8E

Goose Yellow · Khaki · Sunflower

HEX
#F0DA8E
RGB
rgb(240, 218, 142)
HSL
hsl(47, 77%, 75%)
HSB
hsb(47, 41%, 94%)
CMYK
cmyk(0%, 9%, 41%, 6%)
Oklch
oklch(89.0% 0.098 93.8)

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

#A08117

Ochre · DarkGoldenRod · Honey Gold

HEX
#A08117
RGB
rgb(160, 129, 23)
HSL
hsl(46, 75%, 36%)
HSB
hsb(46, 86%, 63%)
CMYK
cmyk(0%, 19%, 86%, 37%)
Oklch
oklch(61.6% 0.119 90.7)

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

#7A382C

Crimson · Brown · Wine Red

HEX
#7A382C
RGB
rgb(122, 56, 44)
HSL
hsl(9, 47%, 33%)
HSB
hsb(9, 64%, 48%)
CMYK
cmyk(0%, 54%, 64%, 52%)
Oklch
oklch(42.6% 0.095 31.9)

Traditional「Crimson」· Paint「Wine Red」· Creative Blush Sunrise

#3C0C29

Rose Purple · Black · Raspberry

HEX
#3C0C29
RGB
rgb(60, 12, 41)
HSL
hsl(324, 67%, 14%)
HSB
hsb(324, 80%, 24%)
CMYK
cmyk(0%, 80%, 32%, 76%)
Oklch
oklch(25.1% 0.083 347.5)

Traditional「Rose Purple」· Paint「Raspberry」· Creative Blush Sunrise

#16130C

Ochre · Black · Amber Gold

HEX
#16130C
RGB
rgb(22, 19, 12)
HSL
hsl(42, 29%, 7%)
HSB
hsb(42, 45%, 9%)
CMYK
cmyk(0%, 14%, 45%, 91%)
Oklch
oklch(18.8% 0.014 87.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F0DA8E
8EA3F0

Analogous

F0AA8E
F0DA8E
D5F08E

Triadic

F0DA8E
8EF0DB
DB8EF0

Split-Comp.

F0DA8E
8ED5F0
AA8EF0

Tetradic

F0DA8E
8EF0AA
8EA3F0
F08ED5

Contrast Matrix WCAG 2.1 Contrast

F0DA8E
A08117
7A382C
3C0C29
16130C
—
2.7
Fail
6.2
AA
11.8
AAA
13.4
AAA
2.7
Fail
—
2.3
Fail
4.4
AA Large
5.0
AA
6.2
AA
2.3
Fail
—
1.9
Fail
2.1
Fail
11.8
AAA
4.4
AA Large
1.9
Fail
—
1.1
Fail
13.4
AAA
5.0
AA
2.1
Fail
1.1
Fail
—
White BG
1.4Fail
3.7AA Large
8.6AAA
16.4AAA
18.5AAA
Black BG
15.1AAA
5.6AA
2.4Fail
1.3Fail
1.1Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

E6E6A0
939231
5D5D2F
272722
15150E

Deuteranopia

E8E9A5
949737
616630
2A2E20
15150E

Tritanopia

EFAFB2
9E4549
773132
3A1C1B
160F0F

Achromatopsia

D8D8D8
7E7E7E
4A4A4A
1E1E1E
131313

Shades & Tints Shades & Tints

#F0DA8E

Dark
Light

#A08117

Dark
Light

#7A382C

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f0da8e;
  --color-2: #a08117;
  --color-3: #7a382c;
  --color-4: #3c0c29;
  --color-5: #16130c;
}

SCSS

$color-1: #f0da8e;
$color-2: #a08117;
$color-3: #7a382c;
$color-4: #3c0c29;
$color-5: #16130c;

TAILWIND

colors: {
  'brand-1': '#f0da8e',
  'brand-2': '#a08117',
  'brand-3': '#7a382c',
  'brand-4': '#3c0c29',
  'brand-5': '#16130c',
}

RGB Array

[240, 218, 142], [160, 129, 23], [122, 56, 44], [60, 12, 41], [22, 19, 12]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F0DA8E, #A08117, #7A382C, #3C0C29, #16130C is ideal for: tech websites, dark mode UIs, game UIs, infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. It is a balanced and harmonious choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #f0da8e; --color-2: #a08117; --color-3: #7a382c; --color-4: #3c0c29; --color-5: #16130c. 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. 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 tech, SaaS, healthcare, eco industries. 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