← Back to Editor

#458750 · #69B376 · #FB174C · #FF3D6A · #FF668A

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

#458750

Celadon · SeaGreen · Forest Green

HEX
#458750
RGB
rgb(69, 135, 80)
HSL
hsl(130, 32%, 40%)
HSB
hsb(130, 49%, 53%)
CMYK
cmyk(49%, 0%, 41%, 47%)
Oklch
oklch(56.5% 0.108 147.7)

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

#69B376

Celadon · MediumSeaGreen · Olive Green

HEX
#69B376
RGB
rgb(105, 179, 118)
HSL
hsl(131, 33%, 56%)
HSB
hsb(131, 41%, 70%)
CMYK
cmyk(41%, 0%, 34%, 30%)
Oklch
oklch(70.2% 0.116 148.5)

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

#FB174C

Vermilion · Crimson · Passion Red

HEX
#FB174C
RGB
rgb(251, 23, 76)
HSL
hsl(346, 97%, 54%)
HSB
hsb(346, 91%, 98%)
CMYK
cmyk(0%, 91%, 70%, 2%)
Oklch
oklch(63.1% 0.246 18.4)

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

#FF3D6A

Peach Pink · Tomato · Coral Red

HEX
#FF3D6A
RGB
rgb(255, 61, 106)
HSL
hsl(346, 100%, 62%)
HSB
hsb(346, 76%, 100%)
CMYK
cmyk(0%, 76%, 58%, 0%)
Oklch
oklch(66.4% 0.227 13.2)

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

#FF668A

Peach Pink · LightCoral · Coral Red

HEX
#FF668A
RGB
rgb(255, 102, 138)
HSL
hsl(346, 100%, 70%)
HSB
hsb(346, 60%, 100%)
CMYK
cmyk(0%, 60%, 46%, 0%)
Oklch
oklch(71.2% 0.188 8.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

458750
87457C

Analogous

5B8745
458750
458771

Triadic

458750
504587
875045

Split-Comp.

458750
714587
87455B

Tetradic

458750
455B87
87457C
877145

Contrast Matrix WCAG 2.1 Contrast

458750
69B376
FB174C
FF3D6A
FF668A
—
1.7
Fail
1.1
Fail
1.3
Fail
1.6
Fail
1.7
Fail
—
1.6
Fail
1.4
Fail
1.1
Fail
1.1
Fail
1.6
Fail
—
1.1
Fail
1.4
Fail
1.3
Fail
1.4
Fail
1.1
Fail
—
1.2
Fail
1.6
Fail
1.1
Fail
1.4
Fail
1.2
Fail
—
White BG
4.3AA Large
2.5Fail
3.9AA Large
3.4AA Large
2.8Fail
Black BG
4.8AA
8.3AAA
5.3AA
6.1AA
7.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

62625D
898A85
98963F
ABA95F
BDBB81

Deuteranopia

5E5961
857F88
A6B73C
B6C55C
C6D17F

Tritanopia

48686A
6D9093
F03533
F55755
F77A79

Achromatopsia

6D6D6D
969696
616161
7C7C7C
989898

Shades & Tints Shades & Tints

#458750

Dark
Light

#69B376

Dark
Light

#FB174C

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #458750;
  --color-2: #69b376;
  --color-3: #fb174c;
  --color-4: #ff3d6a;
  --color-5: #ff668a;
}

SCSS

$color-1: #458750;
$color-2: #69b376;
$color-3: #fb174c;
$color-4: #ff3d6a;
$color-5: #ff668a;

TAILWIND

colors: {
  'brand-1': '#458750',
  'brand-2': '#69b376',
  'brand-3': '#fb174c',
  'brand-4': '#ff3d6a',
  'brand-5': '#ff668a',
}

RGB Array

[69, 135, 80], [105, 179, 118], [251, 23, 76], [255, 61, 106], [255, 102, 138]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #458750, #69B376, #FB174C, #FF3D6A, #FF668A 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: #458750; --color-2: #69b376; --color-3: #fb174c; --color-4: #ff3d6a; --color-5: #ff668a. 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