← Back to Editor

#4FEB15 · #89B964 · #B69B84 · #D19393 · #FF75D3

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 Library

Color Details Color Details

#4FEB15

Pine Green · LimeGreen · Olive Green

HEX
#4FEB15
RGB
rgb(79, 235, 21)
HSL
hsl(104, 84%, 50%)
HSB
hsb(104, 91%, 92%)
CMYK
cmyk(66%, 0%, 91%, 8%)
Oklch
oklch(82.5% 0.261 140.0)

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

#89B964

Celadon · DarkSeaGreen · Olive Green

HEX
#89B964
RGB
rgb(137, 185, 100)
HSL
hsl(94, 38%, 56%)
HSB
hsb(94, 46%, 73%)
CMYK
cmyk(26%, 0%, 46%, 27%)
Oklch
oklch(73.2% 0.125 132.8)

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

#B69B84

Apricot · Tan · Warm Sun

HEX
#B69B84
RGB
rgb(182, 155, 132)
HSL
hsl(28, 26%, 62%)
HSB
hsb(28, 27%, 71%)
CMYK
cmyk(0%, 15%, 27%, 29%)
Oklch
oklch(70.8% 0.046 62.4)

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

#D19393

Peach Pink · Tan · Coral Red

HEX
#D19393
RGB
rgb(209, 147, 147)
HSL
hsl(0, 40%, 70%)
HSB
hsb(0, 30%, 82%)
CMYK
cmyk(0%, 30%, 30%, 18%)
Oklch
oklch(72.4% 0.075 19.1)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#FF75D3

Mauve · Violet · Lilac Purple

HEX
#FF75D3
RGB
rgb(255, 117, 211)
HSL
hsl(319, 100%, 73%)
HSB
hsb(319, 54%, 100%)
CMYK
cmyk(0%, 54%, 17%, 0%)
Oklch
oklch(75.4% 0.197 341.4)

Traditional「Mauve」· Paint「Lilac Purple」· Creative Rose Petal

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

4FEB15
B114EB

Analogous

B9EB14
4FEB15
14EB46

Triadic

4FEB15
144EEB
EB144E

Split-Comp.

4FEB15
4614EB
EB14B9

Tetradic

4FEB15
14B9EB
B114EB
EB4614

Contrast Matrix WCAG 2.1 Contrast

4FEB15
89B964
B69B84
D19393
FF75D3
—
1.4
Fail
1.7
Fail
1.6
Fail
1.5
Fail
1.4
Fail
—
1.1
Fail
1.1
Fail
1.1
Fail
1.7
Fail
1.1
Fail
—
1.0
Fail
1.1
Fail
1.6
Fail
1.1
Fail
1.0
Fail
—
1.1
Fail
1.5
Fail
1.1
Fail
1.1
Fail
1.1
Fail
—
White BG
1.6Fail
2.3Fail
2.6Fail
2.5Fail
2.4Fail
Black BG
13.2AAA
9.2AAA
8.0AAA
8.3AAA
8.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

939449
9E9E79
AAAA8A
B6B693
C3C2BC

Deuteranopia

8A7E55
9B977E
ACAE8B
BABE93
CBD6B7

Tritanopia

57727B
8B898C
B58E8F
CE9393
F8AAA6

Achromatopsia

A4A4A4
A1A1A1
A0A0A0
A6A6A6
A9A9A9

Shades & Tints Shades & Tints

#4FEB15

Dark
Light

#89B964

Dark
Light

#B69B84

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #4feb15;
  --color-2: #89b964;
  --color-3: #b69b84;
  --color-4: #d19393;
  --color-5: #ff75d3;
}

SCSS

$color-1: #4feb15;
$color-2: #89b964;
$color-3: #b69b84;
$color-4: #d19393;
$color-5: #ff75d3;

TAILWIND

colors: {
  'brand-1': '#4feb15',
  'brand-2': '#89b964',
  'brand-3': '#b69b84',
  'brand-4': '#d19393',
  'brand-5': '#ff75d3',
}

RGB Array

[79, 235, 21], [137, 185, 100], [182, 155, 132], [209, 147, 147], [255, 117, 211]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #4FEB15, #89B964, #B69B84, #D19393, #FF75D3 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: #4feb15; --color-2: #89b964; --color-3: #b69b84; --color-4: #d19393; --color-5: #ff75d3. 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