← Back to Editor

#7DADAD · #CDC890 · #C27130 · #853220 · #BB472E

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#7DADAD

Slate Blue · CadetBlue · Lake Green

HEX
#7DADAD
RGB
rgb(125, 173, 173)
HSL
hsl(180, 23%, 58%)
HSB
hsb(180, 28%, 68%)
CMYK
cmyk(28%, 0%, 0%, 32%)
Oklch
oklch(71.4% 0.051 196.1)

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

#CDC890

Fresh Green · Tan · Sunflower

HEX
#CDC890
RGB
rgb(205, 200, 144)
HSL
hsl(55, 38%, 68%)
HSB
hsb(55, 30%, 80%)
CMYK
cmyk(0%, 2%, 30%, 20%)
Oklch
oklch(82.3% 0.074 103.6)

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

#C27130

Tangerine · Chocolate · Amber Brown

HEX
#C27130
RGB
rgb(194, 113, 48)
HSL
hsl(27, 60%, 47%)
HSB
hsb(27, 75%, 76%)
CMYK
cmyk(0%, 42%, 75%, 24%)
Oklch
oklch(62.7% 0.129 55.8)

Traditional「Tangerine」· Paint「Amber Brown」· Creative Blush Sunrise

#853220

Vermilion · Brown · Wine Red

HEX
#853220
RGB
rgb(133, 50, 32)
HSL
hsl(11, 61%, 32%)
HSB
hsb(11, 76%, 52%)
CMYK
cmyk(0%, 62%, 76%, 48%)
Oklch
oklch(43.2% 0.118 33.8)

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

#BB472E

Vermilion · Sienna · Passion Red

HEX
#BB472E
RGB
rgb(187, 71, 46)
HSL
hsl(11, 61%, 46%)
HSB
hsb(11, 75%, 73%)
CMYK
cmyk(0%, 62%, 75%, 27%)
Oklch
oklch(55.2% 0.155 33.8)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

7DADAD
AD7B7B

Analogous

7BAD94
7DADAD
7B94AD

Triadic

7DADAD
AD7BAD
ADAD7B

Split-Comp.

7DADAD
AD7B94
AD947B

Tetradic

7DADAD
947BAD
AD7B7B
94AD7B

Contrast Matrix WCAG 2.1 Contrast

7DADAD
CDC890
C27130
853220
BB472E
—
1.5
Fail
1.5
Fail
3.4
AA Large
2.1
Fail
1.5
Fail
—
2.2
Fail
5.0
AA
3.0
AA Large
1.5
Fail
2.2
Fail
—
2.3
Fail
1.4
Fail
3.4
AA Large
5.0
AA
2.3
Fail
—
1.6
Fail
2.1
Fail
3.0
AA Large
1.4
Fail
1.6
Fail
—
White BG
2.5Fail
1.7Fail
3.7AA Large
8.5AAA
5.2AA
Black BG
8.5AAA
12.3AAA
5.7AA
2.5Fail
4.1AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

9292AD
CBCB9E
9F9E40
616024
898834

Deuteranopia

8F8BAD
CBCCA1
A4AA44
666C25
909836

Tritanopia

7FADAD
CDA8AB
BE4C4F
812829
B5393A

Achromatopsia

9F9F9F
C3C3C3
828282
494949
676767

Shades & Tints Shades & Tints

#7DADAD

Dark
Light

#CDC890

Dark
Light

#C27130

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #7dadad;
  --color-2: #cdc890;
  --color-3: #c27130;
  --color-4: #853220;
  --color-5: #bb472e;
}

SCSS

$color-1: #7dadad;
$color-2: #cdc890;
$color-3: #c27130;
$color-4: #853220;
$color-5: #bb472e;

TAILWIND

colors: {
  'brand-1': '#7dadad',
  'brand-2': '#cdc890',
  'brand-3': '#c27130',
  'brand-4': '#853220',
  'brand-5': '#bb472e',
}

RGB Array

[125, 173, 173], [205, 200, 144], [194, 113, 48], [133, 50, 32], [187, 71, 46]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #7DADAD, #CDC890, #C27130, #853220, #BB472E 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: #7dadad; --color-2: #cdc890; --color-3: #c27130; --color-4: #853220; --color-5: #bb472e. 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