← Back to Editor

#CBF2EC · #D1D537 · #E8A70E · #E90E51 · #783E5A

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarmCool

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial AppData Visualization

Color Details Color Details

#CBF2EC

Jade · Lavender · Glacier Blue

HEX
#CBF2EC
RGB
rgb(203, 242, 236)
HSL
hsl(171, 60%, 87%)
HSB
hsb(171, 16%, 95%)
CMYK
cmyk(16%, 0%, 2%, 5%)
Oklch
oklch(93.2% 0.041 185.2)

Traditional「Jade」· Paint「Glacier Blue」· Creative Arctic Pool

#D1D537

Autumn Sage · GoldenRod · Sunflower

HEX
#D1D537
RGB
rgb(209, 213, 55)
HSL
hsl(62, 65%, 53%)
HSB
hsb(62, 74%, 84%)
CMYK
cmyk(2%, 0%, 74%, 16%)
Oklch
oklch(84.3% 0.169 111.0)

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

#E8A70E

Ochre · GoldenRod · Honey Gold

HEX
#E8A70E
RGB
rgb(232, 167, 14)
HSL
hsl(42, 89%, 48%)
HSB
hsb(42, 94%, 91%)
CMYK
cmyk(0%, 28%, 94%, 9%)
Oklch
oklch(77.0% 0.157 80.1)

Traditional「Ochre」· Paint「Honey Gold」· Creative Blush Sunrise

#E90E51

Dark Violet · Crimson · Camellia

HEX
#E90E51
RGB
rgb(233, 14, 81)
HSL
hsl(342, 89%, 48%)
HSB
hsb(342, 94%, 91%)
CMYK
cmyk(0%, 94%, 65%, 9%)
Oklch
oklch(59.7% 0.234 14.7)

Traditional「Dark Violet」· Paint「Camellia」· Creative Blush Sunrise

#783E5A

Dark Violet · DimGray · Camellia

HEX
#783E5A
RGB
rgb(120, 62, 90)
HSL
hsl(331, 32%, 36%)
HSB
hsb(331, 48%, 47%)
CMYK
cmyk(0%, 48%, 25%, 53%)
Oklch
oklch(44.6% 0.088 351.0)

Traditional「Dark Violet」· Paint「Camellia」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

CBF2EC
F2CAD0

Analogous

CAF2D8
CBF2EC
CAE4F2

Triadic

CBF2EC
ECCAF2
F2ECCA

Split-Comp.

CBF2EC
F2CAE4
F2D8CA

Tetradic

CBF2EC
D8CAF2
F2CAD0
E4F2CA

Contrast Matrix WCAG 2.1 Contrast

CBF2EC
D1D537
E8A70E
E90E51
783E5A
—
1.3
Fail
1.8
Fail
3.8
AA Large
6.6
AA
1.3
Fail
—
1.3
Fail
2.9
Fail
5.0
AA
1.8
Fail
1.3
Fail
—
2.1
Fail
3.8
AA Large
3.8
AA Large
2.9
Fail
2.1
Fail
—
1.8
Fail
6.6
AA
5.0
AA
3.8
AA Large
1.8
Fail
—
White BG
1.2Fail
1.6Fail
2.1Fail
4.5AA
8.0AAA
Black BG
17.5AAA
13.3AAA
10.0AAA
4.6AA
2.6Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

DCDCED
D3D35D
CCCB33
8A8841
5F5E53

Deuteranopia

DAD7EE
D3D266
D0D43C
97A73D
626752

Tritanopia

CDEFEF
D17B82
E55057
DE3431
754E4D

Achromatopsia

E6E6E6
C2C2C2
A9A9A9
575757
535353

Shades & Tints Shades & Tints

#CBF2EC

Dark
Light

#D1D537

Dark
Light

#E8A70E

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #cbf2ec;
  --color-2: #d1d537;
  --color-3: #e8a70e;
  --color-4: #e90e51;
  --color-5: #783e5a;
}

SCSS

$color-1: #cbf2ec;
$color-2: #d1d537;
$color-3: #e8a70e;
$color-4: #e90e51;
$color-5: #783e5a;

TAILWIND

colors: {
  'brand-1': '#cbf2ec',
  'brand-2': '#d1d537',
  'brand-3': '#e8a70e',
  'brand-4': '#e90e51',
  'brand-5': '#783e5a',
}

RGB Array

[203, 242, 236], [209, 213, 55], [232, 167, 14], [233, 14, 81], [120, 62, 90]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #CBF2EC, #D1D537, #E8A70E, #E90E51, #783E5A is ideal for: social media posters, mobile apps, e-commerce promos, infographics, data visualization, accessible design. Vivid colors effectively attract user attention. High contrast ensures clear visual hierarchy and readability. It is a vibrant and energetic choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #cbf2ec; --color-2: #d1d537; --color-3: #e8a70e; --color-4: #e90e51; --color-5: #783e5a. 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. High-contrast palettes naturally meet WCAG accessibility standards. 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 food & dining, entertainment, kids education, social industries. Bold colors convey vitality and innovation. 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