← Back to Editor

#53645B · #FF507B · #FF9443 · #FACB3B · #B0B853

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarm

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial App

Color Details Color Details

#53645B

Celadon · DimGray · Charcoal

HEX
#53645B
RGB
rgb(83, 100, 91)
HSL
hsl(148, 9%, 36%)
HSB
hsb(148, 17%, 39%)
CMYK
cmyk(17%, 0%, 9%, 61%)
Oklch
oklch(48.6% 0.025 162.3)

Traditional「Celadon」· Paint「Charcoal」· Creative Midnight Shadow

#FF507B

Peach Pink · Salmon · Coral Red

HEX
#FF507B
RGB
rgb(255, 80, 123)
HSL
hsl(345, 100%, 66%)
HSB
hsb(345, 69%, 100%)
CMYK
cmyk(0%, 69%, 52%, 0%)
Oklch
oklch(68.5% 0.211 10.2)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Rose Petal

#FF9443

Apricot · Coral · Warm Sun

HEX
#FF9443
RGB
rgb(255, 148, 67)
HSL
hsl(26, 100%, 63%)
HSB
hsb(26, 74%, 100%)
CMYK
cmyk(0%, 42%, 74%, 0%)
Oklch
oklch(76.7% 0.159 54.4)

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

#FACB3B

Ginger · SandyBrown · Sunflower

HEX
#FACB3B
RGB
rgb(250, 203, 59)
HSL
hsl(45, 95%, 61%)
HSB
hsb(45, 76%, 98%)
CMYK
cmyk(0%, 19%, 76%, 2%)
Oklch
oklch(86.0% 0.159 89.6)

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

#B0B853

Autumn Sage · Tan · Sunflower

HEX
#B0B853
RGB
rgb(176, 184, 83)
HSL
hsl(65, 42%, 52%)
HSB
hsb(65, 55%, 72%)
CMYK
cmyk(4%, 0%, 55%, 28%)
Oklch
oklch(75.6% 0.126 113.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

53645B
64545C

Analogous

546454
53645B
546464

Triadic

53645B
5B5464
645B54

Split-Comp.

53645B
645464
645454

Tetradic

53645B
545464
64545C
646454

Contrast Matrix WCAG 2.1 Contrast

53645B
FF507B
FF9443
FACB3B
B0B853
—
2.0
Fail
2.9
Fail
4.1
AA Large
2.9
Fail
2.0
Fail
—
1.4
Fail
2.0
Fail
1.5
Fail
2.9
Fail
1.4
Fail
—
1.4
Fail
1.0
Fail
4.1
AA Large
2.0
Fail
1.4
Fail
—
1.4
Fail
2.9
Fail
1.5
Fail
1.0
Fail
1.4
Fail
—
White BG
6.3AA
3.1AA Large
2.2Fail
1.5Fail
2.1Fail
Black BG
3.3AA Large
6.7AA
9.6AAA
13.7AAA
9.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

5A5B5D
B3B271
D1D057
E6E55E
B3B46B

Deuteranopia

59585E
BDCB6E
D7DF5B
E8EC66
B3B271

Tritanopia

545F5F
F66867
FA6669
F8797F
B07F83

Achromatopsia

5E5E5E
898989
ABABAB
C9C9C9
AAAAAA

Shades & Tints Shades & Tints

#53645B

Dark
Light

#FF507B

Dark
Light

#FF9443

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #53645b;
  --color-2: #ff507b;
  --color-3: #ff9443;
  --color-4: #facb3b;
  --color-5: #b0b853;
}

SCSS

$color-1: #53645b;
$color-2: #ff507b;
$color-3: #ff9443;
$color-4: #facb3b;
$color-5: #b0b853;

TAILWIND

colors: {
  'brand-1': '#53645b',
  'brand-2': '#ff507b',
  'brand-3': '#ff9443',
  'brand-4': '#facb3b',
  'brand-5': '#b0b853',
}

RGB Array

[83, 100, 91], [255, 80, 123], [255, 148, 67], [250, 203, 59], [176, 184, 83]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #53645B, #FF507B, #FF9443, #FACB3B, #B0B853 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: #53645b; --color-2: #ff507b; --color-3: #ff9443; --color-4: #facb3b; --color-5: #b0b853. 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