← Back to Editor

#785D4A · #ABC6A5 · #AF9771 · #ECE398 · #FAC098

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#785D4A

Tangerine · DimGray · Amber Brown

HEX
#785D4A
RGB
rgb(120, 93, 74)
HSL
hsl(25, 24%, 38%)
HSB
hsb(25, 38%, 47%)
CMYK
cmyk(0%, 22%, 38%, 53%)
Oklch
oklch(50.1% 0.046 56.6)

Traditional「Tangerine」· Paint「Amber Brown」· Creative Blush Sunrise

#ABC6A5

Celadon · DarkGray · Apple Green

HEX
#ABC6A5
RGB
rgb(171, 198, 165)
HSL
hsl(109, 22%, 71%)
HSB
hsb(109, 17%, 78%)
CMYK
cmyk(14%, 0%, 17%, 22%)
Oklch
oklch(79.7% 0.054 140.0)

Traditional「Celadon」· Paint「Apple Green」· Creative Mint Breeze

#AF9771

Ginger · Tan · Warm Sun

HEX
#AF9771
RGB
rgb(175, 151, 113)
HSL
hsl(37, 28%, 56%)
HSB
hsb(37, 35%, 69%)
CMYK
cmyk(0%, 14%, 35%, 31%)
Oklch
oklch(68.8% 0.060 78.9)

Traditional「Ginger」· Paint「Warm Sun」· Creative Blush Sunrise

#ECE398

Fresh Green · Khaki · Lemon Cream

HEX
#ECE398
RGB
rgb(236, 227, 152)
HSL
hsl(54, 69%, 76%)
HSB
hsb(54, 36%, 93%)
CMYK
cmyk(0%, 4%, 36%, 7%)
Oklch
oklch(90.6% 0.095 102.2)

Traditional「Fresh Green」· Paint「Lemon Cream」· Creative Lemon Fizz

#FAC098

Apricot · BurlyWood · Peach Orange

HEX
#FAC098
RGB
rgb(250, 192, 152)
HSL
hsl(24, 91%, 79%)
HSB
hsb(24, 39%, 98%)
CMYK
cmyk(0%, 23%, 39%, 2%)
Oklch
oklch(85.1% 0.085 55.9)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

785D4A
4A6578

Analogous

784A4E
785D4A
78744A

Triadic

785D4A
4A785D
5D4A78

Split-Comp.

785D4A
4A7874
4A4E78

Tetradic

785D4A
4E784A
4A6578
744A78

Contrast Matrix WCAG 2.1 Contrast

785D4A
ABC6A5
AF9771
ECE398
FAC098
—
3.3
AA Large
2.2
Fail
4.6
AA
3.8
AA Large
3.3
AA Large
—
1.5
Fail
1.4
Fail
1.2
Fail
2.2
Fail
1.5
Fail
—
2.1
Fail
1.7
Fail
4.6
AA
1.4
Fail
2.1
Fail
—
1.2
Fail
3.8
AA Large
1.2
Fail
1.7
Fail
1.2
Fail
—
White BG
6.1AA
1.8Fail
2.8Fail
1.3Fail
1.6Fail
Black BG
3.5AA Large
11.4AAA
7.5AAA
16.0AAA
13.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

6C6C4F
B7B7AD
A5A47A
E8E8AA
E1E0A2

Deuteranopia

6E7050
B5B3AF
A6A87C
E9E9AF
E4E9A4

Tritanopia

775253
ACB3B5
AE8183
ECB8BC
F7A9AB

Achromatopsia

636363
BABABA
9A9A9A
DDDDDD
CDCDCD

Shades & Tints Shades & Tints

#785D4A

Dark
Light

#ABC6A5

Dark
Light

#AF9771

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #785d4a;
  --color-2: #abc6a5;
  --color-3: #af9771;
  --color-4: #ece398;
  --color-5: #fac098;
}

SCSS

$color-1: #785d4a;
$color-2: #abc6a5;
$color-3: #af9771;
$color-4: #ece398;
$color-5: #fac098;

TAILWIND

colors: {
  'brand-1': '#785d4a',
  'brand-2': '#abc6a5',
  'brand-3': '#af9771',
  'brand-4': '#ece398',
  'brand-5': '#fac098',
}

RGB Array

[120, 93, 74], [171, 198, 165], [175, 151, 113], [236, 227, 152], [250, 192, 152]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #785D4A, #ABC6A5, #AF9771, #ECE398, #FAC098 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: #785d4a; --color-2: #abc6a5; --color-3: #af9771; --color-4: #ece398; --color-5: #fac098. 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