#CC7D83 + #AF3649 + #F1CD99 + #A59B56 + #AE424F · nature - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

CalmOrganicGroundedWarm

Industry INDUSTRY

EcoWellnessOutdoor

UI Context UI CONTEXT

Brand WebsiteBlog

Color Details Color Details

#CC7D83

Peach Pink · LightCoral · Coral Red

HEX

#CC7D83

RGB

rgb(204, 125, 131)

HSL

hsl(355, 44%, 65%)

HSB

hsb(355, 39%, 80%)

CMYK

cmyk(0%, 39%, 36%, 20%)

Oklch

oklch(67.5% 0.098 15.1)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Rose Petal

#AF3649

Crimson · Brown · Passion Red

HEX

#AF3649

RGB

rgb(175, 54, 73)

HSL

hsl(351, 53%, 45%)

HSB

hsb(351, 69%, 69%)

CMYK

cmyk(0%, 69%, 58%, 31%)

Oklch

oklch(51.6% 0.156 15.5)

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

#F1CD99

Goose Yellow · Khaki · Peach Orange

HEX

#F1CD99

RGB

rgb(241, 205, 153)

HSL

hsl(35, 76%, 77%)

HSB

hsb(35, 37%, 95%)

CMYK

cmyk(0%, 15%, 37%, 5%)

Oklch

oklch(86.7% 0.079 76.5)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

#A59B56

Autumn Sage · Gray · Honey Gold

HEX

#A59B56

RGB

rgb(165, 155, 86)

HSL

hsl(52, 31%, 49%)

HSB

hsb(52, 48%, 65%)

CMYK

cmyk(0%, 6%, 48%, 35%)

Oklch

oklch(68.3% 0.091 101.1)

Traditional「Autumn Sage」· Paint「Honey Gold」· Creative Blush Sunrise

#AE424F

Crimson · Sienna · Passion Red

HEX

#AE424F

RGB

rgb(174, 66, 79)

HSL

hsl(353, 45%, 47%)

HSB

hsb(353, 62%, 68%)

CMYK

cmyk(0%, 62%, 55%, 32%)

Oklch

oklch(53.0% 0.141 16.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

CC7D83

7ECDC6

Analogous

CD7EAC

CC7D83

CD9F7E

Triadic

CC7D83

85CD7E

7E85CD

Split-Comp.

CC7D83

7ECD9F

7EACCD

Tetradic

CC7D83

ACCD7E

7ECDC6

9F7ECD

Contrast Matrix WCAG 2.1 Contrast

CC7D83	AF3649	F1CD99	A59B56	AE424F
—	2.0 Fail	2.0 Fail	1.1 Fail	1.8 Fail
2.0 Fail	—	4.0 AA Large	2.2 Fail	1.1 Fail
2.0 Fail	4.0 AA Large	—	1.9 Fail	3.8 AA Large
1.1 Fail	2.2 Fail	1.9 Fail	—	2.0 Fail
1.8 Fail	1.1 Fail	3.8 AA Large	2.0 Fail	—

White BG

3.1AA Large

6.1AA

1.5Fail

2.8Fail

5.7AA

Black BG

6.8AA

3.4AA Large

13.9AAA

7.4AAA

3.7AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

AAA982

7B7A44

E1E1A6

A1A167

7F7E4C

Deuteranopia

AEB481

828B43

E4E6A9

A1A26B

868E4B

Tritanopia

C88080

A94140

EFB0B2

A57477

A94949

Achromatopsia

959595

5C5C5C

D2D2D2

969696

646464

Shades & Tints Shades & Tints

#CC7D83

Dark

Light

#AF3649

Dark

Light

#F1CD99

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #cc7d83;
  --color-2: #af3649;
  --color-3: #f1cd99;
  --color-4: #a59b56;
  --color-5: #ae424f;
}

SCSS

$color-1: #cc7d83;
$color-2: #af3649;
$color-3: #f1cd99;
$color-4: #a59b56;
$color-5: #ae424f;

TAILWIND

colors: {
  'brand-1': '#cc7d83',
  'brand-2': '#af3649',
  'brand-3': '#f1cd99',
  'brand-4': '#a59b56',
  'brand-5': '#ae424f',
}

RGB Array

[204, 125, 131], [175, 54, 73], [241, 205, 153], [165, 155, 86], [174, 66, 79]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This nature-style palette of #CC7D83, #AF3649, #F1CD99, #A59B56, #AE424F 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: #cc7d83; --color-2: #af3649; --color-3: #f1cd99; --color-4: #a59b56; --color-5: #ae424f. 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