← Back to Editor

#7A5C54 · #B1613E · #CF8A22 · #C3C74F · #F2E0B0

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

#7A5C54

Crimson · DimGray · Wine Red

HEX
#7A5C54
RGB
rgb(122, 92, 84)
HSL
hsl(13, 18%, 40%)
HSB
hsb(13, 31%, 48%)
CMYK
cmyk(0%, 25%, 31%, 52%)
Oklch
oklch(50.3% 0.042 35.4)

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

#B1613E

Tangerine · Sienna · Amber Brown

HEX
#B1613E
RGB
rgb(177, 97, 62)
HSL
hsl(18, 48%, 47%)
HSB
hsb(18, 65%, 69%)
CMYK
cmyk(0%, 45%, 65%, 31%)
Oklch
oklch(57.8% 0.115 43.6)

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

#CF8A22

Ochre · GoldenRod · Amber Brown

HEX
#CF8A22
RGB
rgb(207, 138, 34)
HSL
hsl(36, 72%, 47%)
HSB
hsb(36, 84%, 81%)
CMYK
cmyk(0%, 33%, 84%, 19%)
Oklch
oklch(68.8% 0.138 71.2)

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

#C3C74F

Autumn Sage · GoldenRod · Sunflower

HEX
#C3C74F
RGB
rgb(195, 199, 79)
HSL
hsl(62, 52%, 55%)
HSB
hsb(62, 60%, 78%)
CMYK
cmyk(2%, 0%, 60%, 22%)
Oklch
oklch(80.4% 0.142 111.0)

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

#F2E0B0

Goose Yellow · Wheat · Lemon Cream

HEX
#F2E0B0
RGB
rgb(242, 224, 176)
HSL
hsl(44, 72%, 82%)
HSB
hsb(44, 27%, 95%)
CMYK
cmyk(0%, 7%, 27%, 5%)
Oklch
oklch(91.0% 0.065 89.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

7A5C54
547078

Analogous

78545E
7A5C54
786E54

Triadic

7A5C54
54785C
5C5478

Split-Comp.

7A5C54
54786E
545E78

Tetradic

7A5C54
5E7854
547078
6E5478

Contrast Matrix WCAG 2.1 Contrast

7A5C54
B1613E
CF8A22
C3C74F
F2E0B0
—
1.3
Fail
2.1
Fail
3.3
AA Large
4.6
AA
1.3
Fail
—
1.6
Fail
2.5
Fail
3.5
AA Large
2.1
Fail
1.6
Fail
—
1.6
Fail
2.2
Fail
3.3
AA Large
2.5
Fail
1.6
Fail
—
1.4
Fail
4.6
AA
3.5
AA Large
2.2
Fail
1.4
Fail
—
White BG
6.0AA
4.5AA
2.9Fail
1.8Fail
1.3Fail
Black BG
3.5AA Large
4.6AA
7.3AAA
11.6AAA
16.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

6D6D56
8E8E46
B1B13B
C5C56C
EAEABC

Deuteranopia

6F7156
939949
B5BA41
C5C473
EBEDBE

Tritanopia

785758
AD4D4F
CC4F53
C38388
F1C5C7

Achromatopsia

646464
757575
939393
B8B8B8
E0E0E0

Shades & Tints Shades & Tints

#7A5C54

Dark
Light

#B1613E

Dark
Light

#CF8A22

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #7a5c54;
  --color-2: #b1613e;
  --color-3: #cf8a22;
  --color-4: #c3c74f;
  --color-5: #f2e0b0;
}

SCSS

$color-1: #7a5c54;
$color-2: #b1613e;
$color-3: #cf8a22;
$color-4: #c3c74f;
$color-5: #f2e0b0;

TAILWIND

colors: {
  'brand-1': '#7a5c54',
  'brand-2': '#b1613e',
  'brand-3': '#cf8a22',
  'brand-4': '#c3c74f',
  'brand-5': '#f2e0b0',
}

RGB Array

[122, 92, 84], [177, 97, 62], [207, 138, 34], [195, 199, 79], [242, 224, 176]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #7A5C54, #B1613E, #CF8A22, #C3C74F, #F2E0B0 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: #7a5c54; --color-2: #b1613e; --color-3: #cf8a22; --color-4: #c3c74f; --color-5: #f2e0b0. 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