#53453A + #DD5168 + #F0754E + #B6BB1B + #7DB89B · cool - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#53453A

Tangerine · DarkOliveGreen · Amber Brown

HEX

#53453A

RGB

rgb(83, 69, 58)

HSL

hsl(26, 18%, 28%)

HSB

hsb(26, 30%, 33%)

CMYK

cmyk(0%, 17%, 30%, 67%)

Oklch

oklch(40.2% 0.026 60.1)

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

#DD5168

Vermilion · Tomato · Passion Red

HEX

#DD5168

RGB

rgb(221, 81, 104)

HSL

hsl(350, 67%, 59%)

HSB

hsb(350, 63%, 87%)

CMYK

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

Oklch

oklch(62.8% 0.175 13.9)

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

#F0754E

Peach Pink · Coral · Coral Red

HEX

#F0754E

RGB

rgb(240, 117, 78)

HSL

hsl(14, 84%, 62%)

HSB

hsb(14, 68%, 94%)

CMYK

cmyk(0%, 51%, 68%, 6%)

Oklch

oklch(69.9% 0.161 38.1)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#B6BB1B

Autumn Sage · GoldenRod · Honey Gold

HEX

#B6BB1B

RGB

rgb(182, 187, 27)

HSL

hsl(62, 75%, 42%)

HSB

hsb(62, 86%, 73%)

CMYK

cmyk(3%, 0%, 86%, 27%)

Oklch

oklch(76.3% 0.163 111.7)

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

#7DB89B

Jade · DarkSeaGreen · Apple Green

HEX

#7DB89B

RGB

rgb(125, 184, 155)

HSL

hsl(151, 29%, 61%)

HSB

hsb(151, 32%, 72%)

CMYK

cmyk(32%, 0%, 16%, 28%)

Oklch

oklch(73.4% 0.075 162.5)

Traditional「Jade」· Paint「Apple Green」· Creative Arctic Pool

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

53453A

3B4954

Analogous

543B3C

53453A

54533B

Triadic

53453A

3B5446

463B54

Split-Comp.

53453A

3B5453

3B3C54

Tetradic

53453A

3C543B

3B4954

533B54

Contrast Matrix WCAG 2.1 Contrast

53453A	DD5168	F0754E	B6BB1B	7DB89B
—	2.4 Fail	3.2 AA Large	4.4 AA Large	4.0 AA Large
2.4 Fail	—	1.4 Fail	1.9 Fail	1.7 Fail
3.2 AA Large	1.4 Fail	—	1.4 Fail	1.3 Fail
4.4 AA Large	1.9 Fail	1.4 Fail	—	1.1 Fail
4.0 AA Large	1.7 Fail	1.3 Fail	1.1 Fail	—

White BG

9.2AAA

3.9AA Large

2.9Fail

2.1Fail

2.3Fail

Black BG

2.3Fail

5.5AA

7.4AAA

10.1AAA

9.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

4D4D3D

A09F62

BBBA57

B8B842

9797A2

Deuteranopia

4E4F3D

A9B361

C2CB5A

B8B84B

938FA4

Tritanopia

523F3F

D65E5D

EA5F61

B66067

80A8A9

Achromatopsia

484848

7D7D7D

959595

A7A7A7

A3A3A3

Shades & Tints Shades & Tints

#53453A

Dark

Light

#DD5168

Dark

Light

#F0754E

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #53453a;
  --color-2: #dd5168;
  --color-3: #f0754e;
  --color-4: #b6bb1b;
  --color-5: #7db89b;
}

SCSS

$color-1: #53453a;
$color-2: #dd5168;
$color-3: #f0754e;
$color-4: #b6bb1b;
$color-5: #7db89b;

TAILWIND

colors: {
  'brand-1': '#53453a',
  'brand-2': '#dd5168',
  'brand-3': '#f0754e',
  'brand-4': '#b6bb1b',
  'brand-5': '#7db89b',
}

RGB Array

[83, 69, 58], [221, 81, 104], [240, 117, 78], [182, 187, 27], [125, 184, 155]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This cool-style palette of #53453A, #DD5168, #F0754E, #B6BB1B, #7DB89B 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: #53453a; --color-2: #dd5168; --color-3: #f0754e; --color-4: #b6bb1b; --color-5: #7db89b. 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 cool-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