#728B87 + #819794 + #F8E7CB + #C4B88E + #CD3D58 · nature - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

CalmOrganicGroundedWarmCool

Industry INDUSTRY

EcoWellnessOutdoor

UI Context UI CONTEXT

Brand WebsiteBlog

Color Details Color Details

#728B87

Mineral Blue · SlateGray · Mint Ice

HEX

#728B87

RGB

rgb(114, 139, 135)

HSL

hsl(170, 10%, 50%)

HSB

hsb(170, 18%, 55%)

CMYK

cmyk(18%, 0%, 3%, 45%)

Oklch

oklch(61.6% 0.029 184.6)

Traditional「Mineral Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#819794

Mineral Blue · LightSlateGray · Lake Green

HEX

#819794

RGB

rgb(129, 151, 148)

HSL

hsl(172, 10%, 55%)

HSB

hsb(172, 15%, 59%)

CMYK

cmyk(15%, 0%, 2%, 41%)

Oklch

oklch(65.8% 0.025 186.6)

Traditional「Mineral Blue」· Paint「Lake Green」· Creative Blush Sunrise

#F8E7CB

Goose Yellow · Bisque · Peach Orange

HEX

#F8E7CB

RGB

rgb(248, 231, 203)

HSL

hsl(37, 76%, 88%)

HSB

hsb(37, 18%, 97%)

CMYK

cmyk(0%, 7%, 18%, 3%)

Oklch

oklch(93.4% 0.041 80.3)

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

#C4B88E

Ginger · Tan · Sunflower

HEX

#C4B88E

RGB

rgb(196, 184, 142)

HSL

hsl(47, 31%, 66%)

HSB

hsb(47, 28%, 77%)

CMYK

cmyk(0%, 6%, 28%, 23%)

Oklch

oklch(78.2% 0.058 94.0)

Traditional「Ginger」· Paint「Sunflower」· Creative Lemon Fizz

#CD3D58

Crimson · Crimson · Passion Red

HEX

#CD3D58

RGB

rgb(205, 61, 88)

HSL

hsl(349, 59%, 52%)

HSB

hsb(349, 70%, 80%)

CMYK

cmyk(0%, 70%, 57%, 20%)

Oklch

oklch(57.7% 0.180 14.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

728B87

8C7377

Analogous

738C7B

728B87

73848C

Triadic

728B87

88738C

8C8873

Split-Comp.

728B87

8C7384

8C7B73

Tetradic

728B87

7B738C

8C7377

848C73

Contrast Matrix WCAG 2.1 Contrast

728B87	819794	F8E7CB	C4B88E	CD3D58
—	1.2 Fail	3.0 AA Large	1.8 Fail	1.3 Fail
1.2 Fail	—	2.5 Fail	1.6 Fail	1.5 Fail
3.0 AA Large	2.5 Fail	—	1.6 Fail	3.9 AA Large
1.8 Fail	1.6 Fail	1.6 Fail	—	2.4 Fail
1.3 Fail	1.5 Fail	3.9 AA Large	2.4 Fail	—

White BG

3.6AA Large

3.1AA Large

1.2Fail

2.0Fail

4.8AA

Black BG

5.8AA

6.8AA

17.3AAA

10.6AAA

4.4AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

7D7D88

8B8B95

F1F0D2

BFBF98

8F8D51

Deuteranopia

7B7A88

898895

F2F3D3

C0C09B

97A250

Tritanopia

738989

829595

F7D7D8

C3A0A2

C64C4B

Achromatopsia

838383

909090

E9E9E9

B7B7B7

6B6B6B

Shades & Tints Shades & Tints

#728B87

Dark

Light

#819794

Dark

Light

#F8E7CB

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #728b87;
  --color-2: #819794;
  --color-3: #f8e7cb;
  --color-4: #c4b88e;
  --color-5: #cd3d58;
}

SCSS

$color-1: #728b87;
$color-2: #819794;
$color-3: #f8e7cb;
$color-4: #c4b88e;
$color-5: #cd3d58;

TAILWIND

colors: {
  'brand-1': '#728b87',
  'brand-2': '#819794',
  'brand-3': '#f8e7cb',
  'brand-4': '#c4b88e',
  'brand-5': '#cd3d58',
}

RGB Array

[114, 139, 135], [129, 151, 148], [248, 231, 203], [196, 184, 142], [205, 61, 88]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This nature-style palette of #728B87, #819794, #F8E7CB, #C4B88E, #CD3D58 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: #728b87; --color-2: #819794; --color-3: #f8e7cb; --color-4: #c4b88e; --color-5: #cd3d58. 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