#214750 + #2E6D64 + #C9AA71 + #BB8D40 + #AE374D · 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

#214750

Slate Blue · DarkSlateGray · Peacock Green

HEX

#214750

RGB

rgb(33, 71, 80)

HSL

hsl(191, 42%, 22%)

HSB

hsb(191, 59%, 31%)

CMYK

cmyk(59%, 11%, 0%, 69%)

Oklch

oklch(37.4% 0.046 215.2)

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

#2E6D64

Mineral Blue · SeaGreen · Mint Ice

HEX

#2E6D64

RGB

rgb(46, 109, 100)

HSL

hsl(171, 41%, 30%)

HSB

hsb(171, 58%, 43%)

CMYK

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

Oklch

oklch(49.1% 0.066 182.8)

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

#C9AA71

Ginger · Tan · Warm Sun

HEX

#C9AA71

RGB

rgb(201, 170, 113)

HSL

hsl(39, 45%, 62%)

HSB

hsb(39, 44%, 79%)

CMYK

cmyk(0%, 15%, 44%, 21%)

Oklch

oklch(75.2% 0.083 82.1)

Traditional「Ginger」· Paint「Warm Sun」· Creative Honey Glow

#BB8D40

Ochre · GoldenRod · Amber Brown

HEX

#BB8D40

RGB

rgb(187, 141, 64)

HSL

hsl(38, 49%, 49%)

HSB

hsb(38, 66%, 73%)

CMYK

cmyk(0%, 25%, 66%, 27%)

Oklch

oklch(67.3% 0.109 77.8)

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

#AE374D

Crimson · Brown · Passion Red

HEX

#AE374D

RGB

rgb(174, 55, 77)

HSL

hsl(349, 52%, 45%)

HSB

hsb(349, 68%, 68%)

CMYK

cmyk(0%, 68%, 56%, 32%)

Oklch

oklch(51.6% 0.154 13.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

214750

502921

Analogous

215041

214750

212F50

Triadic

214750

502147

475021

Split-Comp.

214750

50212F

504121

Tetradic

214750

412150

502921

2F5021

Contrast Matrix WCAG 2.1 Contrast

214750	2E6D64	C9AA71	BB8D40	AE374D
—	1.7 Fail	4.5 AA	3.4 AA Large	1.7 Fail
1.7 Fail	—	2.7 Fail	2.0 Fail	1.0 Fail
4.5 AA	2.7 Fail	—	1.4 Fail	2.7 Fail
3.4 AA Large	2.0 Fail	1.4 Fail	—	2.0 Fail
1.7 Fail	1.0 Fail	2.7 Fail	2.0 Fail	—

White BG

10.1AAA

6.0AA

2.2Fail

3.0AA Large

6.1AA

Black BG

2.1Fail

3.5AA Large

9.5AAA

7.0AA

3.5AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

31324E

494A66

BCBB7F

A7A753

7A7948

Deuteranopia

2F2C4D

464167

BDC082

AAAD57

818A46

Tritanopia

234C4C

316868

C78A8C

B96165

A84343

Achromatopsia

3D3D3D

595959

ADADAD

929292

5D5D5D

Shades & Tints Shades & Tints

#214750

Dark

Light

#2E6D64

Dark

Light

#C9AA71

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #214750;
  --color-2: #2e6d64;
  --color-3: #c9aa71;
  --color-4: #bb8d40;
  --color-5: #ae374d;
}

SCSS

$color-1: #214750;
$color-2: #2e6d64;
$color-3: #c9aa71;
$color-4: #bb8d40;
$color-5: #ae374d;

TAILWIND

colors: {
  'brand-1': '#214750',
  'brand-2': '#2e6d64',
  'brand-3': '#c9aa71',
  'brand-4': '#bb8d40',
  'brand-5': '#ae374d',
}

RGB Array

[33, 71, 80], [46, 109, 100], [201, 170, 113], [187, 141, 64], [174, 55, 77]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This pastel-style palette of #214750, #2E6D64, #C9AA71, #BB8D40, #AE374D 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: #214750; --color-2: #2e6d64; --color-3: #c9aa71; --color-4: #bb8d40; --color-5: #ae374d. 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