#6ABA9E + #A5AA70 + #C18F66 + #DE6752 + #FD4E5B - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#6ABA9E

Mineral Blue · MediumAquaMarine · Olive Green

HEX

#6ABA9E

RGB

rgb(106, 186, 158)

HSL

hsl(159, 37%, 57%)

HSB

hsb(159, 43%, 73%)

CMYK

cmyk(43%, 0%, 15%, 27%)

Oklch

oklch(72.9% 0.090 169.2)

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

#A5AA70

Autumn Sage · DarkSeaGreen · Sunflower

HEX

#A5AA70

RGB

rgb(165, 170, 112)

HSL

hsl(65, 25%, 55%)

HSB

hsb(65, 34%, 67%)

CMYK

cmyk(3%, 0%, 34%, 33%)

Oklch

oklch(72.0% 0.079 112.4)

Traditional「Autumn Sage」· Paint「Sunflower」· Creative Blush Sunrise

#C18F66

Tangerine · DarkSalmon · Warm Sun

HEX

#C18F66

RGB

rgb(193, 143, 102)

HSL

hsl(27, 42%, 58%)

HSB

hsb(27, 47%, 76%)

CMYK

cmyk(0%, 26%, 47%, 24%)

Oklch

oklch(68.9% 0.082 60.2)

Traditional「Tangerine」· Paint「Warm Sun」· Creative Blush Sunrise

#DE6752

Vermilion · Tomato · Passion Red

HEX

#DE6752

RGB

rgb(222, 103, 82)

HSL

hsl(9, 68%, 60%)

HSB

hsb(9, 63%, 87%)

CMYK

cmyk(0%, 54%, 63%, 13%)

Oklch

oklch(65.4% 0.153 31.7)

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

#FD4E5B

Peach Pink · Tomato · Coral Red

HEX

#FD4E5B

RGB

rgb(253, 78, 91)

HSL

hsl(356, 98%, 65%)

HSB

hsb(356, 69%, 99%)

CMYK

cmyk(0%, 69%, 64%, 1%)

Oklch

oklch(67.3% 0.210 20.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

6ABA9E

BA6985

Analogous

69BA75

6ABA9E

69AEBA

Triadic

6ABA9E

9E69BA

BA9E69

Split-Comp.

6ABA9E

BA69AE

BA7569

Tetradic

6ABA9E

7569BA

BA6985

AEBA69

Contrast Matrix WCAG 2.1 Contrast

6ABA9E	A5AA70	C18F66	DE6752	FD4E5B
—	1.1 Fail	1.2 Fail	1.5 Fail	1.4 Fail
1.1 Fail	—	1.2 Fail	1.4 Fail	1.3 Fail
1.2 Fail	1.2 Fail	—	1.2 Fail	1.2 Fail
1.5 Fail	1.4 Fail	1.2 Fail	—	1.0 Fail
1.4 Fail	1.3 Fail	1.2 Fail	1.0 Fail	—

White BG

2.3Fail

2.4Fail

2.8Fail

3.4AA Large

3.3AA Large

Black BG

9.1AAA

8.6AAA

7.4AAA

6.2AA

6.4AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

8D8DA5

A7A77E

ABAB70

AAA957

B1B058

Deuteranopia

8882A6

A7A781

AEB272

B1BA58

BBC957

Tritanopia

6EAAAB

A5898C

BF7879

D85B5C

F45555

Achromatopsia

9F9F9F

A2A2A2

999999

888888

848484

Shades & Tints Shades & Tints

#6ABA9E

Dark

Light

#A5AA70

Dark

Light

#C18F66

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #6aba9e;
  --color-2: #a5aa70;
  --color-3: #c18f66;
  --color-4: #de6752;
  --color-5: #fd4e5b;
}

SCSS

$color-1: #6aba9e;
$color-2: #a5aa70;
$color-3: #c18f66;
$color-4: #de6752;
$color-5: #fd4e5b;

TAILWIND

colors: {
  'brand-1': '#6aba9e',
  'brand-2': '#a5aa70',
  'brand-3': '#c18f66',
  'brand-4': '#de6752',
  'brand-5': '#fd4e5b',
}

RGB Array

[106, 186, 158], [165, 170, 112], [193, 143, 102], [222, 103, 82], [253, 78, 91]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #6ABA9E, #A5AA70, #C18F66, #DE6752, #FD4E5B 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: #6aba9e; --color-2: #a5aa70; --color-3: #c18f66; --color-4: #de6752; --color-5: #fd4e5b. 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 general-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