← Back to Editor

#54462C · #85755B · #EFBD5C · #F5C78C · #B67E6F

nature

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

CalmOrganicGroundedWarm

Industry INDUSTRY

EcoWellnessOutdoor

UI Context UI CONTEXT

Brand WebsiteBlogData Visualization

Color Details Color Details

#54462C

Ochre · DarkOliveGreen · Cinnamon

HEX
#54462C
RGB
rgb(84, 70, 44)
HSL
hsl(39, 31%, 25%)
HSB
hsb(39, 48%, 33%)
CMYK
cmyk(0%, 17%, 48%, 67%)
Oklch
oklch(40.2% 0.044 82.3)

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

#85755B

Ochre · DimGray · Amber Brown

HEX
#85755B
RGB
rgb(133, 117, 91)
HSL
hsl(37, 19%, 44%)
HSB
hsb(37, 32%, 52%)
CMYK
cmyk(0%, 12%, 32%, 48%)
Oklch
oklch(57.0% 0.043 79.7)

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

#EFBD5C

Ginger · SandyBrown · Sunflower

HEX
#EFBD5C
RGB
rgb(239, 189, 92)
HSL
hsl(40, 82%, 65%)
HSB
hsb(40, 62%, 94%)
CMYK
cmyk(0%, 21%, 62%, 6%)
Oklch
oklch(82.5% 0.128 81.9)

Traditional「Ginger」· Paint「Sunflower」· Creative Lemon Fizz

#F5C78C

Goose Yellow · BurlyWood · Warm Sun

HEX
#F5C78C
RGB
rgb(245, 199, 140)
HSL
hsl(34, 84%, 75%)
HSB
hsb(34, 43%, 96%)
CMYK
cmyk(0%, 19%, 43%, 4%)
Oklch
oklch(85.7% 0.092 73.0)

Traditional「Goose Yellow」· Paint「Warm Sun」· Creative Honey Glow

#B67E6F

Crimson · Gray · Passion Red

HEX
#B67E6F
RGB
rgb(182, 126, 111)
HSL
hsl(13, 33%, 57%)
HSB
hsb(13, 39%, 71%)
CMYK
cmyk(0%, 31%, 39%, 29%)
Oklch
oklch(64.6% 0.074 35.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

54462C
2C3A54

Analogous

54322C
54462C
4E542C

Triadic

54462C
2C5446
462C54

Split-Comp.

54462C
2C4E54
322C54

Tetradic

54462C
2C5432
2C3A54
542C4E

Contrast Matrix WCAG 2.1 Contrast

54462C
85755B
EFBD5C
F5C78C
B67E6F
—
2.0
Fail
5.3
AA
5.9
AA
2.7
Fail
2.0
Fail
—
2.6
Fail
2.9
Fail
1.3
Fail
5.3
AA
2.6
Fail
—
1.1
Fail
2.0
Fail
5.9
AA
2.9
Fail
1.1
Fail
—
2.2
Fail
2.7
Fail
1.3
Fail
2.0
Fail
2.2
Fail
—
White BG
9.2AAA
4.5AA Large
1.7Fail
1.6Fail
3.4AA Large
Black BG
2.3Fail
4.7AA
12.1AAA
13.4AAA
6.2AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

4E4E32
7E7E61
D9D973
E1E19A
9E9D73

Deuteranopia

4F5034
7F8063
DCE079
E4E79E
A1A573

Tritanopia

533738
846667
EC868A
F3A6A8
B37576

Achromatopsia

474747
777777
C1C1C1
CECECE
8D8D8D

Shades & Tints Shades & Tints

#54462C

Dark
Light

#85755B

Dark
Light

#EFBD5C

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #54462c;
  --color-2: #85755b;
  --color-3: #efbd5c;
  --color-4: #f5c78c;
  --color-5: #b67e6f;
}

SCSS

$color-1: #54462c;
$color-2: #85755b;
$color-3: #efbd5c;
$color-4: #f5c78c;
$color-5: #b67e6f;

TAILWIND

colors: {
  'brand-1': '#54462c',
  'brand-2': '#85755b',
  'brand-3': '#efbd5c',
  'brand-4': '#f5c78c',
  'brand-5': '#b67e6f',
}

RGB Array

[84, 70, 44], [133, 117, 91], [239, 189, 92], [245, 199, 140], [182, 126, 111]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This nature-style palette of #54462C, #85755B, #EFBD5C, #F5C78C, #B67E6F 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: #54462c; --color-2: #85755b; --color-3: #efbd5c; --color-4: #f5c78c; --color-5: #b67e6f. 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 nature-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