#AD8A4C + #66503B + #817D53 + #D1C972 + #5A5A43 · nature - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

CalmOrganicGroundedWarm

Industry INDUSTRY

EcoWellnessOutdoor

UI Context UI CONTEXT

Brand WebsiteBlog

Color Details Color Details

#AD8A4C

Ochre · Sienna · Amber Brown

HEX

#AD8A4C

RGB

rgb(173, 138, 76)

HSL

hsl(38, 39%, 49%)

HSB

hsb(38, 56%, 68%)

CMYK

cmyk(0%, 20%, 56%, 32%)

Oklch

oklch(65.3% 0.091 80.4)

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

#66503B

Tangerine · DarkOliveGreen · Amber Brown

HEX

#66503B

RGB

rgb(102, 80, 59)

HSL

hsl(29, 27%, 32%)

HSB

hsb(29, 42%, 40%)

CMYK

cmyk(0%, 22%, 42%, 60%)

Oklch

oklch(44.8% 0.044 65.0)

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

#817D53

Autumn Sage · DimGray · Honey Gold

HEX

#817D53

RGB

rgb(129, 125, 83)

HSL

hsl(55, 22%, 42%)

HSB

hsb(55, 36%, 51%)

CMYK

cmyk(0%, 3%, 36%, 49%)

Oklch

oklch(58.3% 0.060 103.4)

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

#D1C972

Fresh Green · BurlyWood · Sunflower

HEX

#D1C972

RGB

rgb(209, 201, 114)

HSL

hsl(55, 51%, 63%)

HSB

hsb(55, 45%, 82%)

CMYK

cmyk(0%, 4%, 45%, 18%)

Oklch

oklch(82.4% 0.109 103.9)

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

#5A5A43

Autumn Sage · DarkOliveGreen · Honey Gold

HEX

#5A5A43

RGB

rgb(90, 90, 67)

HSL

hsl(60, 15%, 31%)

HSB

hsb(60, 26%, 35%)

CMYK

cmyk(0%, 0%, 26%, 65%)

Oklch

oklch(46.1% 0.035 107.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

AD8A4C

4C70AE

Analogous

AE594C

AD8A4C

A1AE4C

Triadic

AD8A4C

4CAE8A

8A4CAE

Split-Comp.

AD8A4C

4CA1AE

594CAE

Tetradic

AD8A4C

4CAE59

4C70AE

AE4CA1

Contrast Matrix WCAG 2.1 Contrast

AD8A4C	66503B	817D53	D1C972	5A5A43
—	2.3 Fail	1.3 Fail	1.9 Fail	2.2 Fail
2.3 Fail	—	1.8 Fail	4.4 AA Large	1.1 Fail
1.3 Fail	1.8 Fail	—	2.5 Fail	1.7 Fail
1.9 Fail	4.4 AA Large	2.5 Fail	—	4.1 AA Large
2.2 Fail	1.1 Fail	1.7 Fail	4.1 AA Large	—

White BG

3.2AA Large

7.6AAA

4.2AA Large

1.7Fail

7.1AAA

Black BG

6.5AA

2.8Fail

5.0AA

12.3AAA

3.0Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

9E9E5B

5C5C40

7F7F5D

CECD87

5A5A49

Deuteranopia

A0A35F

5E5F41

808060

CECF8C

5A5A4A

Tritanopia

AB6769

654445

816567

D1989B

5A4D4E

Achromatopsia

8D8D8D

545454

797979

C1C1C1

575757

Shades & Tints Shades & Tints

#AD8A4C

Dark

Light

#66503B

Dark

Light

#817D53

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ad8a4c;
  --color-2: #66503b;
  --color-3: #817d53;
  --color-4: #d1c972;
  --color-5: #5a5a43;
}

SCSS

$color-1: #ad8a4c;
$color-2: #66503b;
$color-3: #817d53;
$color-4: #d1c972;
$color-5: #5a5a43;

TAILWIND

colors: {
  'brand-1': '#ad8a4c',
  'brand-2': '#66503b',
  'brand-3': '#817d53',
  'brand-4': '#d1c972',
  'brand-5': '#5a5a43',
}

RGB Array

[173, 138, 76], [102, 80, 59], [129, 125, 83], [209, 201, 114], [90, 90, 67]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This nature-style palette of #AD8A4C, #66503B, #817D53, #D1C972, #5A5A43 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: #ad8a4c; --color-2: #66503b; --color-3: #817d53; --color-4: #d1c972; --color-5: #5a5a43. 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