← Back to Editor

#362A11 · #65664D · #BAAC70 · #E0D7AB · #F25A5A

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

#362A11

Ochre · Black · Amber Gold

HEX
#362A11
RGB
rgb(54, 42, 17)
HSL
hsl(41, 52%, 14%)
HSB
hsb(41, 69%, 21%)
CMYK
cmyk(0%, 22%, 69%, 79%)
Oklch
oklch(29.2% 0.043 83.9)

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

#65664D

Autumn Sage · DimGray · Honey Gold

HEX
#65664D
RGB
rgb(101, 102, 77)
HSL
hsl(62, 14%, 35%)
HSB
hsb(62, 25%, 40%)
CMYK
cmyk(1%, 0%, 25%, 60%)
Oklch
oklch(50.2% 0.038 109.6)

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

#BAAC70

Ginger · Tan · Sunflower

HEX
#BAAC70
RGB
rgb(186, 172, 112)
HSL
hsl(49, 35%, 58%)
HSB
hsb(49, 40%, 73%)
CMYK
cmyk(0%, 8%, 40%, 27%)
Oklch
oklch(74.2% 0.081 96.6)

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

#E0D7AB

Fresh Green · Wheat · Lemon Cream

HEX
#E0D7AB
RGB
rgb(224, 215, 171)
HSL
hsl(50, 46%, 77%)
HSB
hsb(50, 24%, 88%)
CMYK
cmyk(0%, 4%, 24%, 12%)
Oklch
oklch(87.5% 0.059 97.8)

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

#F25A5A

Peach Pink · Tomato · Coral Red

HEX
#F25A5A
RGB
rgb(242, 90, 90)
HSL
hsl(0, 85%, 65%)
HSB
hsb(0, 63%, 95%)
CMYK
cmyk(0%, 63%, 63%, 5%)
Oklch
oklch(66.8% 0.187 23.7)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

362A11
111D36

Analogous

361811
362A11
2F3611

Triadic

362A11
11362B
2B1136

Split-Comp.

362A11
112F36
181136

Tetradic

362A11
113618
111D36
36112F

Contrast Matrix WCAG 2.1 Contrast

362A11
65664D
BAAC70
E0D7AB
F25A5A
—
2.4
Fail
6.2
AA
9.7
AAA
4.3
AA Large
2.4
Fail
—
2.6
Fail
4.1
AA Large
1.8
Fail
6.2
AA
2.6
Fail
—
1.6
Fail
1.4
Fail
9.7
AAA
4.1
AA Large
1.6
Fail
—
2.3
Fail
4.3
AA Large
1.8
Fail
1.4
Fail
2.3
Fail
—
White BG
14.0AAA
5.9AA
2.3Fail
1.5Fail
3.3AA Large
Black BG
1.5Fail
3.6AA Large
9.2AAA
14.5AAA
6.4AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

313117
656553
B4B47F
DCDCB6
B0AF5A

Deuteranopia

323219
656555
B5B682
DDDDB8
B9C45A

Tritanopia

351C1D
655859
B98A8D
E0BEC0
EA5A5A

Achromatopsia

2B2B2B
636363
A9A9A9
D5D5D5
878787

Shades & Tints Shades & Tints

#362A11

Dark
Light

#65664D

Dark
Light

#BAAC70

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #362a11;
  --color-2: #65664d;
  --color-3: #baac70;
  --color-4: #e0d7ab;
  --color-5: #f25a5a;
}

SCSS

$color-1: #362a11;
$color-2: #65664d;
$color-3: #baac70;
$color-4: #e0d7ab;
$color-5: #f25a5a;

TAILWIND

colors: {
  'brand-1': '#362a11',
  'brand-2': '#65664d',
  'brand-3': '#baac70',
  'brand-4': '#e0d7ab',
  'brand-5': '#f25a5a',
}

RGB Array

[54, 42, 17], [101, 102, 77], [186, 172, 112], [224, 215, 171], [242, 90, 90]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #362A11, #65664D, #BAAC70, #E0D7AB, #F25A5A is ideal for: 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: #362a11; --color-2: #65664d; --color-3: #baac70; --color-4: #e0d7ab; --color-5: #f25a5a. 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 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