#E37911 + #CC5D19 + #AB3F12 + #855641 + #51656E · pastel - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

GentleSoothingSweetWarmCool

Industry INDUSTRY

Kids & BabyBeautyLifestyle

UI Context UI CONTEXT

E-commerceSocial PostIllustration

Color Details Color Details

#E37911

Ochre · Chocolate · Amber Brown

HEX

#E37911

RGB

rgb(227, 121, 17)

HSL

hsl(30, 86%, 48%)

HSB

hsb(30, 93%, 89%)

CMYK

cmyk(0%, 47%, 93%, 11%)

Oklch

oklch(68.3% 0.163 55.7)

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

#CC5D19

Tangerine · Chocolate · Amber Brown

HEX

#CC5D19

RGB

rgb(204, 93, 25)

HSL

hsl(23, 78%, 45%)

HSB

hsb(23, 88%, 80%)

CMYK

cmyk(0%, 54%, 88%, 20%)

Oklch

oklch(60.7% 0.159 46.4)

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

#AB3F12

Tangerine · Brown · Amber Brown

HEX

#AB3F12

RGB

rgb(171, 63, 18)

HSL

hsl(18, 81%, 37%)

HSB

hsb(18, 89%, 67%)

CMYK

cmyk(0%, 63%, 89%, 33%)

Oklch

oklch(51.3% 0.151 39.7)

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

#855641

Tangerine · Sienna · Amber Brown

HEX

#855641

RGB

rgb(133, 86, 65)

HSL

hsl(19, 34%, 39%)

HSB

hsb(19, 51%, 52%)

CMYK

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

Oklch

oklch(50.0% 0.071 44.8)

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

#51656E

Slate Blue · DimGray · Mint Ice

HEX

#51656E

RGB

rgb(81, 101, 110)

HSL

hsl(199, 15%, 37%)

HSB

hsb(199, 26%, 43%)

CMYK

cmyk(26%, 8%, 0%, 57%)

Oklch

oklch(49.4% 0.028 227.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E37911

117AE4

Analogous

E41111

E37911

E4E411

Triadic

E37911

11E47A

7A11E4

Split-Comp.

E37911

11E4E4

1111E4

Tetradic

E37911

11E411

117AE4

E411E4

Contrast Matrix WCAG 2.1 Contrast

E37911	CC5D19	AB3F12	855641	51656E
—	1.4 Fail	2.0 Fail	2.1 Fail	2.0 Fail
1.4 Fail	—	1.5 Fail	1.5 Fail	1.5 Fail
2.0 Fail	1.5 Fail	—	1.0 Fail	1.0 Fail
2.1 Fail	1.5 Fail	1.0 Fail	—	1.0 Fail
2.0 Fail	1.5 Fail	1.0 Fail	1.0 Fail	—

White BG

3.0Fail

4.1AA Large

6.1AA

6.2AA

6.1AA

Black BG

7.0AAA

5.1AA

3.5AA Large

3.4AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

B5B42A

9C9B29

7C7B1D

717046

5A5A6C

Deuteranopia

BBC330

A2AB2D

838B20

737747

59576B

Tritanopia

DE3E42

C63639

A62527

834A4B

526A6A

Achromatopsia

8D8D8D

767676

5A5A5A

626262

606060

Shades & Tints Shades & Tints

#E37911

Dark

Light

#CC5D19

Dark

Light

#AB3F12

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e37911;
  --color-2: #cc5d19;
  --color-3: #ab3f12;
  --color-4: #855641;
  --color-5: #51656e;
}

SCSS

$color-1: #e37911;
$color-2: #cc5d19;
$color-3: #ab3f12;
$color-4: #855641;
$color-5: #51656e;

TAILWIND

colors: {
  'brand-1': '#e37911',
  'brand-2': '#cc5d19',
  'brand-3': '#ab3f12',
  'brand-4': '#855641',
  'brand-5': '#51656e',
}

RGB Array

[227, 121, 17], [204, 93, 25], [171, 63, 18], [133, 86, 65], [81, 101, 110]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This pastel-style palette of #E37911, #CC5D19, #AB3F12, #855641, #51656E 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: #e37911; --color-2: #cc5d19; --color-3: #ab3f12; --color-4: #855641; --color-5: #51656e. 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 pastel-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