← Back to Editor

#FFF7B9 · #C5BB61 · #7D614F · #D2120D · #AC6026

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarm

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial AppData Visualization

Color Details Color Details

#FFF7B9

Fresh Green · Bisque · Lemon Cream

HEX
#FFF7B9
RGB
rgb(255, 247, 185)
HSL
hsl(53, 100%, 86%)
HSB
hsb(53, 27%, 100%)
CMYK
cmyk(0%, 3%, 27%, 0%)
Oklch
oklch(96.8% 0.079 101.6)

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

#C5BB61

Autumn Sage · Tan · Sunflower

HEX
#C5BB61
RGB
rgb(197, 187, 97)
HSL
hsl(54, 46%, 58%)
HSB
hsb(54, 51%, 77%)
CMYK
cmyk(0%, 5%, 51%, 23%)
Oklch
oklch(78.2% 0.113 103.0)

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

#7D614F

Tangerine · DimGray · Amber Brown

HEX
#7D614F
RGB
rgb(125, 97, 79)
HSL
hsl(23, 23%, 40%)
HSB
hsb(23, 37%, 49%)
CMYK
cmyk(0%, 22%, 37%, 51%)
Oklch
oklch(51.6% 0.046 54.2)

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

#D2120D

Vermilion · FireBrick · Passion Red

HEX
#D2120D
RGB
rgb(210, 18, 13)
HSL
hsl(2, 88%, 44%)
HSB
hsb(2, 94%, 82%)
CMYK
cmyk(0%, 91%, 94%, 18%)
Oklch
oklch(54.7% 0.218 29.1)

Traditional「Vermilion」· Paint「Passion Red」· Creative Blush Sunrise

#AC6026

Tangerine · Sienna · Amber Brown

HEX
#AC6026
RGB
rgb(172, 96, 38)
HSL
hsl(26, 64%, 41%)
HSB
hsb(26, 78%, 67%)
CMYK
cmyk(0%, 44%, 78%, 33%)
Oklch
oklch(56.7% 0.121 54.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FFF7B9
B8C0FF

Analogous

FFD3B8
FFF7B9
E4FFB8

Triadic

FFF7B9
B8FFF7
F7B8FF

Split-Comp.

FFF7B9
B8E4FF
D3B8FF

Tetradic

FFF7B9
B8FFD3
B8C0FF
FFB8E4

Contrast Matrix WCAG 2.1 Contrast

FFF7B9
C5BB61
7D614F
D2120D
AC6026
—
1.8
Fail
5.2
AA
5.0
AA
4.3
AA Large
1.8
Fail
—
2.9
Fail
2.8
Fail
2.4
Fail
5.2
AA
2.9
Fail
—
1.0
Fail
1.2
Fail
5.0
AA
2.8
Fail
1.0
Fail
—
1.2
Fail
4.3
AA Large
2.4
Fail
1.2
Fail
1.2
Fail
—
White BG
1.1Fail
2.0Fail
5.7AA
5.5AA
4.7AA
Black BG
19.3AAA
10.7AAA
3.7AA Large
3.8AA Large
4.5AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

FCFBC8
C1C177
717153
7F7D0E
8B8A34

Deuteranopia

FCFDCC
C1C27C
737554
8A980F
909537

Tritanopia

FFD4D6
C4888C
7C5758
C80F0F
A83F42

Achromatopsia

F2F2F2
B4B4B4
676767
4B4B4B
707070

Shades & Tints Shades & Tints

#FFF7B9

Dark
Light

#C5BB61

Dark
Light

#7D614F

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fff7b9;
  --color-2: #c5bb61;
  --color-3: #7d614f;
  --color-4: #d2120d;
  --color-5: #ac6026;
}

SCSS

$color-1: #fff7b9;
$color-2: #c5bb61;
$color-3: #7d614f;
$color-4: #d2120d;
$color-5: #ac6026;

TAILWIND

colors: {
  'brand-1': '#fff7b9',
  'brand-2': '#c5bb61',
  'brand-3': '#7d614f',
  'brand-4': '#d2120d',
  'brand-5': '#ac6026',
}

RGB Array

[255, 247, 185], [197, 187, 97], [125, 97, 79], [210, 18, 13], [172, 96, 38]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FFF7B9, #C5BB61, #7D614F, #D2120D, #AC6026 is ideal for: social media posters, mobile apps, e-commerce promos, infographics, data visualization, accessible design. Vivid colors effectively attract user attention. High contrast ensures clear visual hierarchy and readability. It is a vibrant and energetic choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #fff7b9; --color-2: #c5bb61; --color-3: #7d614f; --color-4: #d2120d; --color-5: #ac6026. 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 food & dining, entertainment, kids education, social industries. Bold colors convey vitality and innovation. 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