← Back to Editor

#788680 · #DCCAED · #ACF337 · #94315A · #77214C

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#788680

Ink Gray · Gray · Warm Gray

HEX
#788680
RGB
rgb(120, 134, 128)
HSL
hsl(154, 6%, 50%)
HSB
hsb(154, 10%, 53%)
CMYK
cmyk(10%, 0%, 4%, 47%)
Oklch
oklch(60.7% 0.019 168.1)

Traditional「Ink Gray」· Paint「Warm Gray」· Creative Urban Concrete

#DCCAED

Lilac · LightGray · Lavender

HEX
#DCCAED
RGB
rgb(220, 202, 237)
HSL
hsl(271, 49%, 86%)
HSB
hsb(271, 15%, 93%)
CMYK
cmyk(7%, 15%, 0%, 7%)
Oklch
oklch(86.5% 0.051 308.4)

Traditional「Lilac」· Paint「Lavender」· Creative Lavender Dream

#ACF337

Grass Green · GreenYellow · Olive Green

HEX
#ACF337
RGB
rgb(172, 243, 55)
HSL
hsl(83, 89%, 58%)
HSB
hsb(83, 77%, 95%)
CMYK
cmyk(29%, 0%, 77%, 5%)
Oklch
oklch(88.5% 0.217 128.9)

Traditional「Grass Green」· Paint「Olive Green」· Creative Blush Sunrise

#94315A

Dark Violet · Brown · Camellia

HEX
#94315A
RGB
rgb(148, 49, 90)
HSL
hsl(335, 50%, 39%)
HSB
hsb(335, 67%, 58%)
CMYK
cmyk(0%, 67%, 39%, 42%)
Oklch
oklch(47.0% 0.138 358.3)

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

#77214C

Dark Violet · Brown · Camellia

HEX
#77214C
RGB
rgb(119, 33, 76)
HSL
hsl(330, 57%, 30%)
HSB
hsb(330, 72%, 47%)
CMYK
cmyk(0%, 72%, 36%, 53%)
Oklch
oklch(39.8% 0.127 353.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

788680
87787E

Analogous

788779
788680
788687

Triadic

788680
817887
878178

Split-Comp.

788680
877886
877978

Tetradic

788680
797887
87787E
868778

Contrast Matrix WCAG 2.1 Contrast

788680
DCCAED
ACF337
94315A
77214C
—
2.5
Fail
2.8
Fail
1.9
Fail
2.6
Fail
2.5
Fail
—
1.1
Fail
4.8
AA
6.5
AA
2.8
Fail
1.1
Fail
—
5.5
AA
7.4
AAA
1.9
Fail
4.8
AA
5.5
AA
—
1.4
Fail
2.6
Fail
6.5
AA
7.4
AAA
1.4
Fail
—
White BG
3.8AA Large
1.5Fail
1.3Fail
7.4AAA
10.0AAA
Black BG
5.5AA
13.7AAA
15.6AAA
2.8Fail
2.1Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

7E7E81
D4D4E5
CBCB64
696850
525142

Deuteranopia

7D7C82
D5D7E2
C7C16F
6F764E
575D3F

Tritanopia

798383
DBDEDC
B08890
8F4847
733938

Achromatopsia

818181
D3D3D3
C8C8C8
535353
404040

Shades & Tints Shades & Tints

#788680

Dark
Light

#DCCAED

Dark
Light

#ACF337

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #788680;
  --color-2: #dccaed;
  --color-3: #acf337;
  --color-4: #94315a;
  --color-5: #77214c;
}

SCSS

$color-1: #788680;
$color-2: #dccaed;
$color-3: #acf337;
$color-4: #94315a;
$color-5: #77214c;

TAILWIND

colors: {
  'brand-1': '#788680',
  'brand-2': '#dccaed',
  'brand-3': '#acf337',
  'brand-4': '#94315a',
  'brand-5': '#77214c',
}

RGB Array

[120, 134, 128], [220, 202, 237], [172, 243, 55], [148, 49, 90], [119, 33, 76]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #788680, #DCCAED, #ACF337, #94315A, #77214C is ideal for: 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: #788680; --color-2: #dccaed; --color-3: #acf337; --color-4: #94315a; --color-5: #77214c. 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 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