#E7B090 + #B7BF9B + #C6A287 + #DE7165 + #FC383C · nature - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

CalmOrganicGroundedWarm

Industry INDUSTRY

EcoWellnessOutdoor

UI Context UI CONTEXT

Brand WebsiteBlog

Color Details Color Details

#E7B090

Apricot · BurlyWood · Warm Sun

HEX

#E7B090

RGB

rgb(231, 176, 144)

HSL

hsl(22, 64%, 74%)

HSB

hsb(22, 38%, 91%)

CMYK

cmyk(0%, 24%, 38%, 9%)

Oklch

oklch(80.0% 0.078 51.5)

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

#B7BF9B

Willow Green · DarkGray · Apple Green

HEX

#B7BF9B

RGB

rgb(183, 191, 155)

HSL

hsl(73, 22%, 68%)

HSB

hsb(73, 19%, 75%)

CMYK

cmyk(4%, 0%, 19%, 25%)

Oklch

oklch(78.9% 0.050 117.7)

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

#C6A287

Apricot · Tan · Warm Sun

HEX

#C6A287

RGB

rgb(198, 162, 135)

HSL

hsl(26, 36%, 65%)

HSB

hsb(26, 32%, 78%)

CMYK

cmyk(0%, 18%, 32%, 22%)

Oklch

oklch(73.8% 0.057 58.6)

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

#DE7165

Peach Pink · Salmon · Coral Red

HEX

#DE7165

RGB

rgb(222, 113, 101)

HSL

hsl(6, 65%, 63%)

HSB

hsb(6, 55%, 87%)

CMYK

cmyk(0%, 49%, 55%, 13%)

Oklch

oklch(67.2% 0.138 27.8)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#FC383C

Vermilion · Tomato · Passion Red

HEX

#FC383C

RGB

rgb(252, 56, 60)

HSL

hsl(359, 97%, 60%)

HSB

hsb(359, 78%, 99%)

CMYK

cmyk(0%, 78%, 76%, 1%)

Oklch

oklch(64.8% 0.230 25.7)

Traditional「Vermilion」· Paint「Passion Red」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E7B090

92C8E7

Analogous

E7929E

E7B090

E7DC92

Triadic

E7B090

92E7B1

B192E7

Split-Comp.

E7B090

92E7DC

929EE7

Tetradic

E7B090

9EE792

92C8E7

DC92E7

Contrast Matrix WCAG 2.1 Contrast

E7B090	B7BF9B	C6A287	DE7165	FC383C
—	1.0 Fail	1.2 Fail	1.7 Fail	1.9 Fail
1.0 Fail	—	1.2 Fail	1.6 Fail	1.9 Fail
1.2 Fail	1.2 Fail	—	1.3 Fail	1.5 Fail
1.7 Fail	1.6 Fail	1.3 Fail	—	1.2 Fail
1.9 Fail	1.9 Fail	1.5 Fail	1.2 Fail	—

White BG

1.9Fail

2.4Fail

3.2AA Large

3.6AA Large

Black BG

11.0AAA

10.9AAA

8.9AAA

6.7AA

5.8AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

CFCF98

BABBA4

B6B68E

AFAE68

A7A53B

Deuteranopia

D2D79A

BAB9A6

B9BB8F

B5BD69

B3C13B

Tritanopia

E49E9F

B7ABAC

C49394

D96A6B

F23A3A

Achromatopsia

BDBDBD

B9B9B9

AAAAAA

909090

737373

Shades & Tints Shades & Tints

#E7B090

Dark

Light

#B7BF9B

Dark

Light

#C6A287

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e7b090;
  --color-2: #b7bf9b;
  --color-3: #c6a287;
  --color-4: #de7165;
  --color-5: #fc383c;
}

SCSS

$color-1: #e7b090;
$color-2: #b7bf9b;
$color-3: #c6a287;
$color-4: #de7165;
$color-5: #fc383c;

TAILWIND

colors: {
  'brand-1': '#e7b090',
  'brand-2': '#b7bf9b',
  'brand-3': '#c6a287',
  'brand-4': '#de7165',
  'brand-5': '#fc383c',
}

RGB Array

[231, 176, 144], [183, 191, 155], [198, 162, 135], [222, 113, 101], [252, 56, 60]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This nature-style palette of #E7B090, #B7BF9B, #C6A287, #DE7165, #FC383C is ideal for: health products, baby brands, fresh-style blogs. 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: #e7b090; --color-2: #b7bf9b; --color-3: #c6a287; --color-4: #de7165; --color-5: #fc383c. 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?

Light tones suit backgrounds; use dark colors for body text. Mid-tones work for card backgrounds or dividers to add depth. 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