#CE1816 + #7D8B59 + #D5D2A2 + #C8E4C1 + #F6EBBB · nature - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

CalmOrganicGroundedWarm

Industry INDUSTRY

EcoWellnessOutdoor

UI Context UI CONTEXT

Brand WebsiteBlog

Color Details Color Details

#CE1816

Vermilion · FireBrick · Passion Red

HEX

#CE1816

RGB

rgb(206, 24, 22)

HSL

hsl(1, 81%, 45%)

HSB

hsb(1, 89%, 81%)

CMYK

cmyk(0%, 88%, 89%, 19%)

Oklch

oklch(54.3% 0.211 28.4)

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

#7D8B59

Grass Green · Gray · Olive Green

HEX

#7D8B59

RGB

rgb(125, 139, 89)

HSL

hsl(77, 22%, 45%)

HSB

hsb(77, 36%, 55%)

CMYK

cmyk(10%, 0%, 36%, 45%)

Oklch

oklch(61.3% 0.073 121.3)

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

#D5D2A2

Fresh Green · Tan · Sunflower

HEX

#D5D2A2

RGB

rgb(213, 210, 162)

HSL

hsl(56, 38%, 74%)

HSB

hsb(56, 24%, 84%)

CMYK

cmyk(0%, 1%, 24%, 16%)

Oklch

oklch(85.4% 0.063 104.7)

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

#C8E4C1

Celadon · LightGray · Mint Green

HEX

#C8E4C1

RGB

rgb(200, 228, 193)

HSL

hsl(108, 39%, 83%)

HSB

hsb(108, 15%, 89%)

CMYK

cmyk(12%, 0%, 15%, 11%)

Oklch

oklch(88.9% 0.056 139.4)

Traditional「Celadon」· Paint「Mint Green」· Creative Mint Breeze

#F6EBBB

Goose Yellow · Bisque · Lemon Cream

HEX

#F6EBBB

RGB

rgb(246, 235, 187)

HSL

hsl(49, 77%, 85%)

HSB

hsb(49, 24%, 96%)

CMYK

cmyk(0%, 4%, 24%, 4%)

Oklch

oklch(93.7% 0.063 96.6)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

CE1816

16CDD0

Analogous

D01670

CE1816

D07616

Triadic

CE1816

16D019

1916D0

Split-Comp.

CE1816

16D076

1670D0

Tetradic

CE1816

70D016

16CDD0

7616D0

Contrast Matrix WCAG 2.1 Contrast

CE1816	7D8B59	D5D2A2	C8E4C1	F6EBBB
—	1.5 Fail	3.6 AA Large	4.1 AA Large	4.7 AA
1.5 Fail	—	2.4 Fail	2.7 Fail	3.1 AA Large
3.6 AA Large	2.4 Fail	—	1.1 Fail	1.3 Fail
4.1 AA Large	2.7 Fail	1.1 Fail	—	1.1 Fail
4.7 AA	3.1 AA Large	1.3 Fail	1.1 Fail	—

White BG

5.6AA

3.7AA Large

1.5Fail

1.4Fail

1.2Fail

Black BG

3.8AA Large

5.7AA

13.6AAA

15.3AAA

17.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

7F7E16

838365

D4D4AE

D4D4C9

F1F1C7

Deuteranopia

8A9717

828168

D4D4B0

D3D0CC

F2F3C9

Tritanopia

C51717

7E6F71

D5B7B9

C9D0D2

F5D0D2

Achromatopsia

4E4E4E

818181

CDCDCD

D8D8D8

E9E9E9

Shades & Tints Shades & Tints

#CE1816

Dark

Light

#7D8B59

Dark

Light

#D5D2A2

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ce1816;
  --color-2: #7d8b59;
  --color-3: #d5d2a2;
  --color-4: #c8e4c1;
  --color-5: #f6ebbb;
}

SCSS

$color-1: #ce1816;
$color-2: #7d8b59;
$color-3: #d5d2a2;
$color-4: #c8e4c1;
$color-5: #f6ebbb;

TAILWIND

colors: {
  'brand-1': '#ce1816',
  'brand-2': '#7d8b59',
  'brand-3': '#d5d2a2',
  'brand-4': '#c8e4c1',
  'brand-5': '#f6ebbb',
}

RGB Array

[206, 24, 22], [125, 139, 89], [213, 210, 162], [200, 228, 193], [246, 235, 187]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This nature-style palette of #CE1816, #7D8B59, #D5D2A2, #C8E4C1, #F6EBBB 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: #ce1816; --color-2: #7d8b59; --color-3: #d5d2a2; --color-4: #c8e4c1; --color-5: #f6ebbb. 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