← Back to Editor

#FAEA73 · #E18850 · #A5C463 · #B1925D · #398280

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#FAEA73

Fresh Green · Khaki · Sunflower

HEX
#FAEA73
RGB
rgb(250, 234, 115)
HSL
hsl(53, 93%, 72%)
HSB
hsb(53, 54%, 98%)
CMYK
cmyk(0%, 6%, 54%, 2%)
Oklch
oklch(92.7% 0.141 101.7)

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

#E18850

Tangerine · Coral · Warm Sun

HEX
#E18850
RGB
rgb(225, 136, 80)
HSL
hsl(23, 71%, 60%)
HSB
hsb(23, 64%, 88%)
CMYK
cmyk(0%, 40%, 64%, 12%)
Oklch
oklch(71.0% 0.130 51.4)

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

#A5C463

Grass Green · DarkSeaGreen · Olive Green

HEX
#A5C463
RGB
rgb(165, 196, 99)
HSL
hsl(79, 45%, 58%)
HSB
hsb(79, 49%, 77%)
CMYK
cmyk(16%, 0%, 49%, 23%)
Oklch
oklch(77.6% 0.129 124.0)

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

#B1925D

Ginger · Gray · Warm Sun

HEX
#B1925D
RGB
rgb(177, 146, 93)
HSL
hsl(38, 35%, 53%)
HSB
hsb(38, 47%, 69%)
CMYK
cmyk(0%, 18%, 47%, 31%)
Oklch
oklch(67.6% 0.080 80.2)

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

#398280

Mineral Blue · SeaGreen · Mint Ice

HEX
#398280
RGB
rgb(57, 130, 128)
HSL
hsl(178, 39%, 37%)
HSB
hsb(178, 56%, 51%)
CMYK
cmyk(56%, 0%, 2%, 49%)
Oklch
oklch(56.0% 0.072 192.8)

Traditional「Mineral Blue」· Paint「Mint Ice」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FAEA73
7585FA

Analogous

FAA875
FAEA73
C7FA75

Triadic

FAEA73
75FAEB
EB75FA

Split-Comp.

FAEA73
75C7FA
A875FA

Tetradic

FAEA73
75FAA8
7585FA
FA75C7

Contrast Matrix WCAG 2.1 Contrast

FAEA73
E18850
A5C463
B1925D
398280
—
2.2
Fail
1.6
Fail
2.4
Fail
3.7
AA Large
2.2
Fail
—
1.4
Fail
1.1
Fail
1.7
Fail
1.6
Fail
1.4
Fail
—
1.5
Fail
2.3
Fail
2.4
Fail
1.1
Fail
1.5
Fail
—
1.5
Fail
3.7
AA Large
1.7
Fail
2.3
Fail
1.5
Fail
—
White BG
1.2Fail
2.7Fail
2.0Fail
2.9Fail
4.5AA Large
Black BG
17.1AAA
7.8AAA
10.7AAA
7.1AAA
4.7AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

F3F390
BABA5E
B2B37A
A4A36A
595980

Deuteranopia

F4F597
C0C661
B1AE80
A5A86D
544F81

Tritanopia

F9A7AC
DD686B
A78D91
AF7476
3D8181

Achromatopsia

E1E1E1
9C9C9C
B0B0B0
959595
6C6C6C

Shades & Tints Shades & Tints

#FAEA73

Dark
Light

#E18850

Dark
Light

#A5C463

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #faea73;
  --color-2: #e18850;
  --color-3: #a5c463;
  --color-4: #b1925d;
  --color-5: #398280;
}

SCSS

$color-1: #faea73;
$color-2: #e18850;
$color-3: #a5c463;
$color-4: #b1925d;
$color-5: #398280;

TAILWIND

colors: {
  'brand-1': '#faea73',
  'brand-2': '#e18850',
  'brand-3': '#a5c463',
  'brand-4': '#b1925d',
  'brand-5': '#398280',
}

RGB Array

[250, 234, 115], [225, 136, 80], [165, 196, 99], [177, 146, 93], [57, 130, 128]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FAEA73, #E18850, #A5C463, #B1925D, #398280 is ideal for: corporate websites, product showcases, portfolios. 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: #faea73; --color-2: #e18850; --color-3: #a5c463; --color-4: #b1925d; --color-5: #398280. 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 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