← Back to Editor

#928550 · #EBE68B · #E8E7B1 · #CFC89E · #7D736A

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 WebsiteBlog

Color Details Color Details

#928550

Ochre · Gray · Honey Gold

HEX
#928550
RGB
rgb(146, 133, 80)
HSL
hsl(48, 29%, 44%)
HSB
hsb(48, 45%, 57%)
CMYK
cmyk(0%, 9%, 45%, 43%)
Oklch
oklch(61.6% 0.074 96.0)

TraditionalOchre」· PaintHoney Gold」· Creative Blush Sunrise

#EBE68B

Fresh Green · Khaki · Sunflower

HEX
#EBE68B
RGB
rgb(235, 230, 139)
HSL
hsl(57, 71%, 73%)
HSB
hsb(57, 41%, 92%)
CMYK
cmyk(0%, 2%, 41%, 8%)
Oklch
oklch(90.9% 0.113 105.7)

TraditionalFresh Green」· PaintSunflower」· Creative Lemon Fizz

#E8E7B1

Fresh Green · Wheat · Lemon Cream

HEX
#E8E7B1
RGB
rgb(232, 231, 177)
HSL
hsl(59, 54%, 80%)
HSB
hsb(59, 24%, 91%)
CMYK
cmyk(0%, 0%, 24%, 9%)
Oklch
oklch(91.6% 0.070 106.8)

TraditionalFresh Green」· PaintLemon Cream」· Creative Lemon Fizz

#CFC89E

Fresh Green · Tan · Sunflower

HEX
#CFC89E
RGB
rgb(207, 200, 158)
HSL
hsl(51, 34%, 72%)
HSB
hsb(51, 24%, 81%)
CMYK
cmyk(0%, 3%, 24%, 19%)
Oklch
oklch(82.8% 0.057 99.6)

TraditionalFresh Green」· PaintSunflower」· Creative Lemon Fizz

#7D736A

Tangerine · DimGray · Warm Gray

HEX
#7D736A
RGB
rgb(125, 115, 106)
HSL
hsl(28, 8%, 45%)
HSB
hsb(28, 15%, 49%)
CMYK
cmyk(0%, 8%, 15%, 51%)
Oklch
oklch(56.2% 0.018 64.5)

TraditionalTangerine」· PaintWarm Gray」· Creative Urban Concrete

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

928550
505D91

Analogous

916350
928550
7D9150

Triadic

928550
509184
845091

Split-Comp.

928550
507D91
635091

Tetradic

928550
509163
505D91
91507D

Contrast Matrix WCAG 2.1 Contrast

928550
EBE68B
E8E7B1
CFC89E
7D736A
2.8
Fail
2.9
Fail
2.2
Fail
1.3
Fail
2.8
Fail
1.0
Fail
1.3
Fail
3.6
AA Large
2.9
Fail
1.0
Fail
1.3
Fail
3.6
AA Large
2.2
Fail
1.3
Fail
1.3
Fail
2.7
Fail
1.3
Fail
3.6
AA Large
3.6
AA Large
2.7
Fail
White BG
3.7AA Large
1.3Fail
1.3Fail
1.7Fail
4.6AA
Black BG
5.7AA
16.2AAA
16.5AAA
12.4AAA
4.5AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

8C8C5D
E9E9A1
E8E8BE
CCCCA8
79796C

Deuteranopia

8D8E60
E9EAA6
E8E8C1
CCCDAB
797A6D

Tritanopia

916769
EBB2B6
E8C8CB
CFB0B2
7D6E6E

Achromatopsia

838383
DDDDDD
E1E1E1
C5C5C5
757575

Shades & Tints Shades & Tints

#928550

Dark
Light

#EBE68B

Dark
Light

#E8E7B1

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #928550;
  --color-2: #ebe68b;
  --color-3: #e8e7b1;
  --color-4: #cfc89e;
  --color-5: #7d736a;
}

SCSS

$color-1: #928550;
$color-2: #ebe68b;
$color-3: #e8e7b1;
$color-4: #cfc89e;
$color-5: #7d736a;

TAILWIND

colors: {
  'brand-1': '#928550',
  'brand-2': '#ebe68b',
  'brand-3': '#e8e7b1',
  'brand-4': '#cfc89e',
  'brand-5': '#7d736a',
}

RGB Array

[146, 133, 80], [235, 230, 139], [232, 231, 177], [207, 200, 158], [125, 115, 106]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This nature-style palette of #928550, #EBE68B, #E8E7B1, #CFC89E, #7D736A is ideal for: corporate websites, product showcases, portfolios. 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: #928550; --color-2: #ebe68b; --color-3: #e8e7b1; --color-4: #cfc89e; --color-5: #7d736a. 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. 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