← Back to Editor

#998C7C · #48110C · #977A2A · #C5AA67 · #FFDA7F

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

#998C7C

Ginger · Gray · Warm Sun

HEX
#998C7C
RGB
rgb(153, 140, 124)
HSL
hsl(33, 12%, 54%)
HSB
hsb(33, 19%, 60%)
CMYK
cmyk(0%, 8%, 19%, 40%)
Oklch
oklch(64.7% 0.028 73.0)

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

#48110C

Vermilion · Maroon · Deep Berry

HEX
#48110C
RGB
rgb(72, 17, 12)
HSL
hsl(5, 71%, 16%)
HSB
hsb(5, 83%, 28%)
CMYK
cmyk(0%, 76%, 83%, 72%)
Oklch
oklch(27.2% 0.085 29.0)

Traditional「Vermilion」· Paint「Deep Berry」· Creative Blush Sunrise

#977A2A

Ochre · Sienna · Honey Gold

HEX
#977A2A
RGB
rgb(151, 122, 42)
HSL
hsl(44, 56%, 38%)
HSB
hsb(44, 72%, 59%)
CMYK
cmyk(0%, 19%, 72%, 41%)
Oklch
oklch(59.2% 0.103 88.5)

Traditional「Ochre」· Paint「Honey Gold」· Creative Blush Sunrise

#C5AA67

Ginger · Tan · Sunflower

HEX
#C5AA67
RGB
rgb(197, 170, 103)
HSL
hsl(43, 45%, 59%)
HSB
hsb(43, 48%, 77%)
CMYK
cmyk(0%, 14%, 48%, 23%)
Oklch
oklch(74.7% 0.092 88.2)

Traditional「Ginger」· Paint「Sunflower」· Creative Blush Sunrise

#FFDA7F

Goose Yellow · Khaki · Sunflower

HEX
#FFDA7F
RGB
rgb(255, 218, 127)
HSL
hsl(43, 100%, 75%)
HSB
hsb(43, 50%, 100%)
CMYK
cmyk(0%, 15%, 50%, 0%)
Oklch
oklch(90.1% 0.118 87.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

998C7C
7C8898

Analogous

987D7C
998C7C
96987C

Triadic

998C7C
7C988B
8B7C98

Split-Comp.

998C7C
7C9698
7D7C98

Tetradic

998C7C
7C987D
7C8898
987C96

Contrast Matrix WCAG 2.1 Contrast

998C7C
48110C
977A2A
C5AA67
FFDA7F
—
4.7
AA
1.2
Fail
1.5
Fail
2.4
Fail
4.7
AA
—
3.8
AA Large
6.8
AA
11.5
AAA
1.2
Fail
3.8
AA Large
—
1.8
Fail
3.0
AA Large
1.5
Fail
6.8
AA
1.8
Fail
—
1.7
Fail
2.4
Fail
11.5
AAA
3.0
AA Large
1.7
Fail
—
White BG
3.3AA Large
15.4AAA
4.1AA Large
2.3Fail
1.3Fail
Black BG
6.4AA
1.4Fail
5.1AA
9.3AAA
15.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

939380
30300D
8A8A3D
B9B977
EFEF95

Deuteranopia

949581
33380D
8C8E42
BBBD7B
F1F49A

Tritanopia

988384
450E0E
964D50
C48487
FDA6AA

Achromatopsia

8E8E8E
212121
7A7A7A
AAAAAA
DBDBDB

Shades & Tints Shades & Tints

#998C7C

Dark
Light

#48110C

Dark
Light

#977A2A

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #998c7c;
  --color-2: #48110c;
  --color-3: #977a2a;
  --color-4: #c5aa67;
  --color-5: #ffda7f;
}

SCSS

$color-1: #998c7c;
$color-2: #48110c;
$color-3: #977a2a;
$color-4: #c5aa67;
$color-5: #ffda7f;

TAILWIND

colors: {
  'brand-1': '#998c7c',
  'brand-2': '#48110c',
  'brand-3': '#977a2a',
  'brand-4': '#c5aa67',
  'brand-5': '#ffda7f',
}

RGB Array

[153, 140, 124], [72, 17, 12], [151, 122, 42], [197, 170, 103], [255, 218, 127]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #998C7C, #48110C, #977A2A, #C5AA67, #FFDA7F 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: #998c7c; --color-2: #48110c; --color-3: #977a2a; --color-4: #c5aa67; --color-5: #ffda7f. 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