← Back to Editor

#DD3E52 · #FFA763 · #F0D675 · #BCB26A · #4D7471

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 App

Color Details Color Details

#DD3E52

Vermilion · Crimson · Passion Red

HEX
#DD3E52
RGB
rgb(221, 62, 82)
HSL
hsl(352, 70%, 55%)
HSB
hsb(352, 72%, 87%)
CMYK
cmyk(0%, 72%, 63%, 13%)
Oklch
oklch(60.3% 0.195 18.5)

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

#FFA763

Apricot · SandyBrown · Warm Sun

HEX
#FFA763
RGB
rgb(255, 167, 99)
HSL
hsl(26, 100%, 69%)
HSB
hsb(26, 61%, 100%)
CMYK
cmyk(0%, 35%, 61%, 0%)
Oklch
oklch(80.2% 0.134 57.0)

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

#F0D675

Ginger · Khaki · Sunflower

HEX
#F0D675
RGB
rgb(240, 214, 117)
HSL
hsl(47, 80%, 70%)
HSB
hsb(47, 51%, 94%)
CMYK
cmyk(0%, 11%, 51%, 6%)
Oklch
oklch(87.8% 0.121 94.7)

Traditional「Ginger」· Paint「Sunflower」· Creative Lemon Fizz

#BCB26A

Autumn Sage · Tan · Sunflower

HEX
#BCB26A
RGB
rgb(188, 178, 106)
HSL
hsl(53, 38%, 58%)
HSB
hsb(53, 44%, 74%)
CMYK
cmyk(0%, 5%, 44%, 26%)
Oklch
oklch(75.6% 0.094 101.4)

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

#4D7471

Mineral Blue · DimGray · Mint Ice

HEX
#4D7471
RGB
rgb(77, 116, 113)
HSL
hsl(175, 20%, 38%)
HSB
hsb(175, 34%, 45%)
CMYK
cmyk(34%, 0%, 3%, 55%)
Oklch
oklch(52.9% 0.044 189.8)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

DD3E52
3CDDC7

Analogous

DD3CA2
DD3E52
DD773C

Triadic

DD3E52
51DD3C
3C51DD

Split-Comp.

DD3E52
3CDD77
3CA2DD

Tetradic

DD3E52
A2DD3C
3CDDC7
773CDD

Contrast Matrix WCAG 2.1 Contrast

DD3E52
FFA763
F0D675
BCB26A
4D7471
—
2.2
Fail
3.0
Fail
2.0
Fail
1.2
Fail
2.2
Fail
—
1.3
Fail
1.1
Fail
2.7
Fail
3.0
Fail
1.3
Fail
—
1.5
Fail
3.6
AA Large
2.0
Fail
1.1
Fail
1.5
Fail
—
2.4
Fail
1.2
Fail
2.7
Fail
3.6
AA Large
2.4
Fail
—
White BG
4.3AA Large
1.9Fail
1.4Fail
2.2Fail
5.2AA
Black BG
4.9AA
11.0AAA
14.6AAA
9.7AAA
4.1AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

98974D
D9D873
E5E58C
B8B87B
5E5E72

Deuteranopia

A1AD4C
DEE577
E6E892
B8B980
5C5972

Tritanopia

D54949
FB8083
EF9FA3
BC898C
4F7272

Achromatopsia

707070
BABABA
D3D3D3
ADADAD
686868

Shades & Tints Shades & Tints

#DD3E52

Dark
Light

#FFA763

Dark
Light

#F0D675

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #dd3e52;
  --color-2: #ffa763;
  --color-3: #f0d675;
  --color-4: #bcb26a;
  --color-5: #4d7471;
}

SCSS

$color-1: #dd3e52;
$color-2: #ffa763;
$color-3: #f0d675;
$color-4: #bcb26a;
$color-5: #4d7471;

TAILWIND

colors: {
  'brand-1': '#dd3e52',
  'brand-2': '#ffa763',
  'brand-3': '#f0d675',
  'brand-4': '#bcb26a',
  'brand-5': '#4d7471',
}

RGB Array

[221, 62, 82], [255, 167, 99], [240, 214, 117], [188, 178, 106], [77, 116, 113]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #DD3E52, #FFA763, #F0D675, #BCB26A, #4D7471 is ideal for: social media posters, mobile apps, e-commerce promos. Vivid colors effectively attract user attention. 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: #dd3e52; --color-2: #ffa763; --color-3: #f0d675; --color-4: #bcb26a; --color-5: #4d7471. 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 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