← Back to Editor

#7BA26C · #B2AC6F · #E8BD7F · #F48C43 · #FB4245

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 App

Color Details Color Details

#7BA26C

Celadon · Gray · Olive Green

HEX
#7BA26C
RGB
rgb(123, 162, 108)
HSL
hsl(103, 22%, 53%)
HSB
hsb(103, 33%, 64%)
CMYK
cmyk(24%, 0%, 33%, 36%)
Oklch
oklch(66.9% 0.088 137.3)

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

#B2AC6F

Autumn Sage · Tan · Sunflower

HEX
#B2AC6F
RGB
rgb(178, 172, 111)
HSL
hsl(55, 30%, 57%)
HSB
hsb(55, 38%, 70%)
CMYK
cmyk(0%, 3%, 38%, 30%)
Oklch
oklch(73.5% 0.081 103.4)

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

#E8BD7F

Ginger · BurlyWood · Warm Sun

HEX
#E8BD7F
RGB
rgb(232, 189, 127)
HSL
hsl(35, 70%, 70%)
HSB
hsb(35, 45%, 91%)
CMYK
cmyk(0%, 19%, 45%, 9%)
Oklch
oklch(82.3% 0.093 76.0)

Traditional「Ginger」· Paint「Warm Sun」· Creative Honey Glow

#F48C43

Apricot · Coral · Warm Sun

HEX
#F48C43
RGB
rgb(244, 140, 67)
HSL
hsl(25, 89%, 61%)
HSB
hsb(25, 73%, 96%)
CMYK
cmyk(0%, 43%, 73%, 4%)
Oklch
oklch(73.9% 0.153 52.8)

Traditional「Apricot」· Paint「Warm Sun」· Creative Honey Glow

#FB4245

Peach Pink · Tomato · Coral Red

HEX
#FB4245
RGB
rgb(251, 66, 69)
HSL
hsl(359, 96%, 62%)
HSB
hsb(359, 74%, 98%)
CMYK
cmyk(0%, 74%, 73%, 2%)
Oklch
oklch(65.5% 0.221 25.0)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Rose Petal

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

7BA26C
936DA2

Analogous

96A26D
7BA26C
6DA278

Triadic

7BA26C
6D7CA2
A26D7C

Split-Comp.

7BA26C
786DA2
A26D96

Tetradic

7BA26C
6D96A2
936DA2
A2786D

Contrast Matrix WCAG 2.1 Contrast

7BA26C
B2AC6F
E8BD7F
F48C43
FB4245
—
1.2
Fail
1.7
Fail
1.2
Fail
1.2
Fail
1.2
Fail
—
1.3
Fail
1.0
Fail
1.5
Fail
1.7
Fail
1.3
Fail
—
1.4
Fail
2.0
Fail
1.2
Fail
1.0
Fail
1.4
Fail
—
1.5
Fail
1.2
Fail
1.5
Fail
2.0
Fail
1.5
Fail
—
White BG
2.9Fail
2.3Fail
1.7Fail
2.4Fail
3.5AA Large
Black BG
7.2AAA
9.0AAA
12.0AAA
8.7AAA
6.0AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

8C8C79
AFAF7E
D5D58E
C7C655
ABA944

Deuteranopia

8A877C
B0B081
D8DB92
CDD559
B6C444

Tritanopia

7D8386
B2898C
E69A9C
EF6366
F24444

Achromatopsia

909090
A7A7A7
C3C3C3
A3A3A3
7A7A7A

Shades & Tints Shades & Tints

#7BA26C

Dark
Light

#B2AC6F

Dark
Light

#E8BD7F

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #7ba26c;
  --color-2: #b2ac6f;
  --color-3: #e8bd7f;
  --color-4: #f48c43;
  --color-5: #fb4245;
}

SCSS

$color-1: #7ba26c;
$color-2: #b2ac6f;
$color-3: #e8bd7f;
$color-4: #f48c43;
$color-5: #fb4245;

TAILWIND

colors: {
  'brand-1': '#7ba26c',
  'brand-2': '#b2ac6f',
  'brand-3': '#e8bd7f',
  'brand-4': '#f48c43',
  'brand-5': '#fb4245',
}

RGB Array

[123, 162, 108], [178, 172, 111], [232, 189, 127], [244, 140, 67], [251, 66, 69]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #7BA26C, #B2AC6F, #E8BD7F, #F48C43, #FB4245 is ideal for: social media posters, mobile apps, e-commerce promos. Vivid colors effectively attract user attention. 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: #7ba26c; --color-2: #b2ac6f; --color-3: #e8bd7f; --color-4: #f48c43; --color-5: #fb4245. 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. 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