← Back to Editor

#784C50 · #B0ACA0 · #D0BBA0 · #F8F0D8 · #60CCB0

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReadingData Visualization

Color Details Color Details

#784C50

Crimson · DimGray · Wine Red

HEX
#784C50
RGB
rgb(120, 76, 80)
HSL
hsl(355, 22%, 38%)
HSB
hsb(355, 37%, 47%)
CMYK
cmyk(0%, 37%, 33%, 53%)
Oklch
oklch(46.7% 0.060 13.7)

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

#B0ACA0

Ginger · DarkGray · Silver Sand

HEX
#B0ACA0
RGB
rgb(176, 172, 160)
HSL
hsl(45, 9%, 66%)
HSB
hsb(45, 9%, 69%)
CMYK
cmyk(0%, 2%, 9%, 31%)
Oklch
oklch(74.4% 0.017 91.6)

Traditional「Ginger」· Paint「Silver Sand」· Creative Urban Concrete

#D0BBA0

Goose Yellow · Tan · Warm Sun

HEX
#D0BBA0
RGB
rgb(208, 187, 160)
HSL
hsl(34, 34%, 72%)
HSB
hsb(34, 23%, 82%)
CMYK
cmyk(0%, 10%, 23%, 18%)
Oklch
oklch(80.3% 0.044 74.0)

Traditional「Goose Yellow」· Paint「Warm Sun」· Creative Honey Glow

#F8F0D8

Goose Yellow · Beige · Lemon Cream

HEX
#F8F0D8
RGB
rgb(248, 240, 216)
HSL
hsl(45, 70%, 91%)
HSB
hsb(45, 13%, 97%)
CMYK
cmyk(0%, 3%, 13%, 3%)
Oklch
oklch(95.5% 0.033 91.7)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

#60CCB0

Mineral Blue · MediumAquaMarine · Lake Green

HEX
#60CCB0
RGB
rgb(96, 204, 176)
HSL
hsl(164, 51%, 59%)
HSB
hsb(164, 53%, 80%)
CMYK
cmyk(53%, 0%, 14%, 20%)
Oklch
oklch(77.4% 0.108 174.0)

Traditional「Mineral Blue」· Paint「Lake Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

784C50
4C7673

Analogous

764C64
784C50
765D4C

Triadic

784C50
4F764C
4C4F76

Split-Comp.

784C50
4C765D
4C6476

Tetradic

784C50
64764C
4C7673
5D4C76

Contrast Matrix WCAG 2.1 Contrast

784C50
B0ACA0
D0BBA0
F8F0D8
60CCB0
—
3.1
AA Large
3.8
AA Large
6.3
AA
3.7
AA Large
3.1
AA Large
—
1.2
Fail
2.0
Fail
1.2
Fail
3.8
AA Large
1.2
Fail
—
1.6
Fail
1.0
Fail
6.3
AA
2.0
Fail
1.6
Fail
—
1.7
Fail
3.7
AA Large
1.2
Fail
1.0
Fail
1.7
Fail
—
White BG
7.1AAA
2.3Fail
1.9Fail
1.1Fail
2.0Fail
Black BG
2.9Fail
9.3AAA
11.3AAA
18.4AAA
10.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

65654F
AEAEA3
C7C7A7
F5F4DE
8F90B7

Deuteranopia

686B4F
AFAFA4
C8CAA8
F5F6DF
8980B8

Tritanopia

764E4E
B0A5A6
CFACAD
F8E2E3
65BCBD

Achromatopsia

5A5A5A
ACACAC
BEBEBE
F0F0F0
A9A9A9

Shades & Tints Shades & Tints

#784C50

Dark
Light

#B0ACA0

Dark
Light

#D0BBA0

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #784c50;
  --color-2: #b0aca0;
  --color-3: #d0bba0;
  --color-4: #f8f0d8;
  --color-5: #60ccb0;
}

SCSS

$color-1: #784c50;
$color-2: #b0aca0;
$color-3: #d0bba0;
$color-4: #f8f0d8;
$color-5: #60ccb0;

TAILWIND

colors: {
  'brand-1': '#784c50',
  'brand-2': '#b0aca0',
  'brand-3': '#d0bba0',
  'brand-4': '#f8f0d8',
  'brand-5': '#60ccb0',
}

RGB Array

[120, 76, 80], [176, 172, 160], [208, 187, 160], [248, 240, 216], [96, 204, 176]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #784C50, #B0ACA0, #D0BBA0, #F8F0D8, #60CCB0 is ideal for: health products, baby brands, fresh-style blogs, infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. 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: #784c50; --color-2: #b0aca0; --color-3: #d0bba0; --color-4: #f8f0d8; --color-5: #60ccb0. 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?

Light tones suit backgrounds; use dark colors for body text. Mid-tones work for card backgrounds or dividers to add depth. 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 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