#704D54 + #78616D + #DBEF81 + #D3E527 + #CE2886 · nature - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

CalmOrganicGroundedWarm

Industry INDUSTRY

EcoWellnessOutdoor

UI Context UI CONTEXT

Brand WebsiteBlog

Color Details Color Details

#704D54

Crimson · DimGray · Wine Red

HEX

#704D54

RGB

rgb(112, 77, 84)

HSL

hsl(348, 19%, 37%)

HSB

hsb(348, 31%, 44%)

CMYK

cmyk(0%, 31%, 25%, 56%)

Oklch

oklch(46.1% 0.048 6.0)

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

#78616D

Rose Purple · DimGray · Camellia

HEX

#78616D

RGB

rgb(120, 97, 109)

HSL

hsl(329, 11%, 43%)

HSB

hsb(329, 19%, 47%)

CMYK

cmyk(0%, 19%, 9%, 53%)

Oklch

oklch(51.9% 0.034 345.6)

Traditional「Rose Purple」· Paint「Camellia」· Creative Blush Sunrise

#DBEF81

Willow Green · Khaki · Apple Green

HEX

#DBEF81

RGB

rgb(219, 239, 129)

HSL

hsl(71, 77%, 72%)

HSB

hsb(71, 46%, 94%)

CMYK

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

Oklch

oklch(91.4% 0.137 117.7)

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

#D3E527

Autumn Sage · GreenYellow · Sunflower

HEX

#D3E527

RGB

rgb(211, 229, 39)

HSL

hsl(66, 79%, 53%)

HSB

hsb(66, 83%, 90%)

CMYK

cmyk(8%, 0%, 83%, 10%)

Oklch

oklch(87.9% 0.192 115.5)

Traditional「Autumn Sage」· Paint「Sunflower」· Creative Blush Sunrise

#CE2886

Rose Purple · MediumVioletRed · Camellia

HEX

#CE2886

RGB

rgb(206, 40, 134)

HSL

hsl(326, 67%, 48%)

HSB

hsb(326, 81%, 81%)

CMYK

cmyk(0%, 81%, 35%, 19%)

Oklch

oklch(57.5% 0.214 351.9)

Traditional「Rose Purple」· Paint「Camellia」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

704D54

4C7069

Analogous

704C66

704D54

70574C

Triadic

704D54

54704C

4C5470

Split-Comp.

704D54

4C7057

4C6670

Tetradic

704D54

66704C

4C7069

574C70

Contrast Matrix WCAG 2.1 Contrast

704D54	78616D	DBEF81	D3E527	CE2886
—	1.3 Fail	5.8 AA	5.2 AA	1.5 Fail
1.3 Fail	—	4.5 AA Large	4.0 AA Large	1.1 Fail
5.8 AA	4.5 AA Large	—	1.1 Fail	3.9 AA Large
5.2 AA	4.0 AA Large	1.1 Fail	—	3.5 AA Large
1.5 Fail	1.1 Fail	3.9 AA Large	3.5 AA Large	—

White BG

7.3AAA

5.6AA

1.3Fail

1.4Fail

4.9AA

Black BG

2.9Fail

3.7AA Large

16.7AAA

15.0AAA

4.3AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

616152

6E6E6A

E4E49C

DBDB55

86856F

Deuteranopia

636552

6F7169

E3E1A2

DAD860

909C6A

Tritanopia

6E5151

776867

DCB1B5

D47981

C65D59

Achromatopsia

585858

696969

DCDCDC

CACACA

646464

Shades & Tints Shades & Tints

#704D54

Dark

Light

#78616D

Dark

Light

#DBEF81

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #704d54;
  --color-2: #78616d;
  --color-3: #dbef81;
  --color-4: #d3e527;
  --color-5: #ce2886;
}

SCSS

$color-1: #704d54;
$color-2: #78616d;
$color-3: #dbef81;
$color-4: #d3e527;
$color-5: #ce2886;

TAILWIND

colors: {
  'brand-1': '#704d54',
  'brand-2': '#78616d',
  'brand-3': '#dbef81',
  'brand-4': '#d3e527',
  'brand-5': '#ce2886',
}

RGB Array

[112, 77, 84], [120, 97, 109], [219, 239, 129], [211, 229, 39], [206, 40, 134]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This nature-style palette of #704D54, #78616D, #DBEF81, #D3E527, #CE2886 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: #704d54; --color-2: #78616d; --color-3: #dbef81; --color-4: #d3e527; --color-5: #ce2886. 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