#CD532A + #D8A643 + #75835F + #2B484C + #172935 · nature - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

CalmOrganicGroundedWarmCool

Industry INDUSTRY

EcoWellnessOutdoor

UI Context UI CONTEXT

Brand WebsiteBlog

Color Details Color Details

#CD532A

Tangerine · Chocolate · Amber Brown

HEX

#CD532A

RGB

rgb(205, 83, 42)

HSL

hsl(15, 66%, 48%)

HSB

hsb(15, 80%, 80%)

CMYK

cmyk(0%, 60%, 80%, 20%)

Oklch

oklch(59.6% 0.164 38.2)

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

#D8A643

Ginger · GoldenRod · Sunflower

HEX

#D8A643

RGB

rgb(216, 166, 67)

HSL

hsl(40, 66%, 55%)

HSB

hsb(40, 69%, 85%)

CMYK

cmyk(0%, 23%, 69%, 15%)

Oklch

oklch(75.4% 0.128 81.4)

Traditional「Ginger」· Paint「Sunflower」· Creative Blush Sunrise

#75835F

Grass Green · DimGray · Olive Green

HEX

#75835F

RGB

rgb(117, 131, 95)

HSL

hsl(83, 16%, 44%)

HSB

hsb(83, 27%, 51%)

CMYK

cmyk(11%, 0%, 27%, 49%)

Oklch

oklch(58.9% 0.055 125.3)

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

#2B484C

Slate Blue · DarkSlateGray · Peacock Green

HEX

#2B484C

RGB

rgb(43, 72, 76)

HSL

hsl(187, 28%, 23%)

HSB

hsb(187, 43%, 30%)

CMYK

cmyk(43%, 5%, 0%, 70%)

Oklch

oklch(38.0% 0.035 206.9)

Traditional「Slate Blue」· Paint「Peacock Green」· Creative Blush Sunrise

#172935

Slate Blue · DarkSlateGray · Deep Sea Blue

HEX

#172935

RGB

rgb(23, 41, 53)

HSL

hsl(204, 39%, 15%)

HSB

hsb(204, 57%, 21%)

CMYK

cmyk(57%, 23%, 0%, 79%)

Oklch

oklch(27.1% 0.033 238.8)

Traditional「Slate Blue」· Paint「Deep Sea Blue」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

CD532A

2AA3CB

Analogous

CB2A52

CD532A

CBA32A

Triadic

CD532A

2ACB52

522ACB

Split-Comp.

CD532A

2ACBA3

2A52CB

Tetradic

CD532A

52CB2A

2AA3CB

A32ACB

Contrast Matrix WCAG 2.1 Contrast

CD532A	D8A643	75835F	2B484C	172935
—	1.9 Fail	1.1 Fail	2.3 Fail	3.5 AA Large
1.9 Fail	—	1.8 Fail	4.4 AA Large	6.7 AA
1.1 Fail	1.8 Fail	—	2.4 Fail	3.7 AA Large
2.3 Fail	4.4 AA Large	2.4 Fail	—	1.5 Fail
3.5 AA Large	6.7 AA	3.7 AA Large	1.5 Fail	—

White BG

4.3AA Large

2.2Fail

4.1AA Large

9.8AAA

14.9AAA

Black BG

4.9AA

9.5AAA

5.2AA

2.1Fail

1.4Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

989734

C2C25B

7B7B68

38384B

1F1F32

Deuteranopia

9FA836

C5C961

7A796A

36344B

1E1C31

Tritanopia

C73C3D

D66E72

766F70

2C4A4A

18302F

Achromatopsia

737373

AAAAAA

7B7B7B

404040

252525

Shades & Tints Shades & Tints

#CD532A

Dark

Light

#D8A643

Dark

Light

#75835F

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #cd532a;
  --color-2: #d8a643;
  --color-3: #75835f;
  --color-4: #2b484c;
  --color-5: #172935;
}

SCSS

$color-1: #cd532a;
$color-2: #d8a643;
$color-3: #75835f;
$color-4: #2b484c;
$color-5: #172935;

TAILWIND

colors: {
  'brand-1': '#cd532a',
  'brand-2': '#d8a643',
  'brand-3': '#75835f',
  'brand-4': '#2b484c',
  'brand-5': '#172935',
}

RGB Array

[205, 83, 42], [216, 166, 67], [117, 131, 95], [43, 72, 76], [23, 41, 53]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This nature-style palette of #CD532A, #D8A643, #75835F, #2B484C, #172935 is ideal for: tech websites, dark mode UIs, game UIs. 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: #cd532a; --color-2: #d8a643; --color-3: #75835f; --color-4: #2b484c; --color-5: #172935. 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?

Dark tones work well as backgrounds; pair with light text for readability. Use the brightest color for CTA buttons and interactive elements. 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