#C2B7A5 + #C7D976 + #74C76D + #369381 + #5C5054 · nature - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

CalmOrganicGroundedWarmCool

Industry INDUSTRY

EcoWellnessOutdoor

UI Context UI CONTEXT

Brand WebsiteBlog

Color Details Color Details

#C2B7A5

Ginger · Silver · Warm Sun

HEX

#C2B7A5

RGB

rgb(194, 183, 165)

HSL

hsl(37, 19%, 70%)

HSB

hsb(37, 15%, 76%)

CMYK

cmyk(0%, 6%, 15%, 24%)

Oklch

oklch(78.4% 0.028 80.2)

Traditional「Ginger」· Paint「Warm Sun」· Creative Honey Glow

#C7D976

Willow Green · BurlyWood · Apple Green

HEX

#C7D976

RGB

rgb(199, 217, 118)

HSL

hsl(71, 57%, 66%)

HSB

hsb(71, 46%, 85%)

CMYK

cmyk(8%, 0%, 46%, 15%)

Oklch

oklch(85.0% 0.126 117.6)

Traditional「Willow Green」· Paint「Apple Green」· Creative Mint Breeze

#74C76D

Celadon · DarkSeaGreen · Olive Green

HEX

#74C76D

RGB

rgb(116, 199, 109)

HSL

hsl(115, 45%, 60%)

HSB

hsb(115, 45%, 78%)

CMYK

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

Oklch

oklch(75.5% 0.149 142.3)

Traditional「Celadon」· Paint「Olive Green」· Creative Blush Sunrise

#369381

Mineral Blue · MediumSeaGreen · Mint Ice

HEX

#369381

RGB

rgb(54, 147, 129)

HSL

hsl(168, 46%, 39%)

HSB

hsb(168, 63%, 58%)

CMYK

cmyk(63%, 0%, 12%, 42%)

Oklch

oklch(60.3% 0.092 177.9)

Traditional「Mineral Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#5C5054

Ink Gray · DimGray · Charcoal

HEX

#5C5054

RGB

rgb(92, 80, 84)

HSL

hsl(340, 7%, 34%)

HSB

hsb(340, 13%, 36%)

CMYK

cmyk(0%, 13%, 9%, 64%)

Oklch

oklch(44.4% 0.017 355.7)

Traditional「Ink Gray」· Paint「Charcoal」· Creative Midnight Shadow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C2B7A5

A4AFC1

Analogous

C1A7A4

C2B7A5

BEC1A4

Triadic

C2B7A5

A4C1B6

B6A4C1

Split-Comp.

C2B7A5

A4BEC1

A7A4C1

Tetradic

C2B7A5

A4C1A7

A4AFC1

C1A4BE

Contrast Matrix WCAG 2.1 Contrast

C2B7A5	C7D976	74C76D	369381	5C5054
—	1.3 Fail	1.0 Fail	1.9 Fail	3.9 AA Large
1.3 Fail	—	1.3 Fail	2.4 Fail	5.0 AA
1.0 Fail	1.3 Fail	—	1.8 Fail	3.7 AA Large
1.9 Fail	2.4 Fail	1.8 Fail	—	2.1 Fail
3.9 AA Large	5.0 AA	3.7 AA Large	2.1 Fail	—

White BG

2.0Fail

1.5Fail

2.1Fail

3.7AA Large

7.7AAA

Black BG

10.6AAA

13.6AAA

10.1AAA

5.6AA

2.7Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

BDBDA9

CFCF8E

989983

5E5F85

575753

Deuteranopia

BEBFAA

CECC94

938D88

595286

585853

Tritanopia

C1ADAE

C8A1A5

789498

3B898A

5B5252

Achromatopsia

B8B8B8

C8C8C8

A4A4A4

757575

545454

Shades & Tints Shades & Tints

#C2B7A5

Dark

Light

#C7D976

Dark

Light

#74C76D

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c2b7a5;
  --color-2: #c7d976;
  --color-3: #74c76d;
  --color-4: #369381;
  --color-5: #5c5054;
}

SCSS

$color-1: #c2b7a5;
$color-2: #c7d976;
$color-3: #74c76d;
$color-4: #369381;
$color-5: #5c5054;

TAILWIND

colors: {
  'brand-1': '#c2b7a5',
  'brand-2': '#c7d976',
  'brand-3': '#74c76d',
  'brand-4': '#369381',
  'brand-5': '#5c5054',
}

RGB Array

[194, 183, 165], [199, 217, 118], [116, 199, 109], [54, 147, 129], [92, 80, 84]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This nature-style palette of #C2B7A5, #C7D976, #74C76D, #369381, #5C5054 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: #c2b7a5; --color-2: #c7d976; --color-3: #74c76d; --color-4: #369381; --color-5: #5c5054. 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