← Back to Editor

#FF6B63 · #FF9763 · #DED26A · #77B897 · #429E8D

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarmCool

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial App

Color Details Color Details

#FF6B63

Peach Pink · Salmon · Coral Red

HEX
#FF6B63
RGB
rgb(255, 107, 99)
HSL
hsl(3, 100%, 69%)
HSB
hsb(3, 61%, 100%)
CMYK
cmyk(0%, 58%, 61%, 0%)
Oklch
oklch(71.0% 0.182 25.9)

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

#FF9763

Apricot · SandyBrown · Warm Sun

HEX
#FF9763
RGB
rgb(255, 151, 99)
HSL
hsl(20, 100%, 69%)
HSB
hsb(20, 61%, 100%)
CMYK
cmyk(0%, 41%, 61%, 0%)
Oklch
oklch(77.5% 0.142 46.5)

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

#DED26A

Fresh Green · BurlyWood · Sunflower

HEX
#DED26A
RGB
rgb(222, 210, 106)
HSL
hsl(54, 64%, 64%)
HSB
hsb(54, 52%, 87%)
CMYK
cmyk(0%, 5%, 52%, 13%)
Oklch
oklch(85.3% 0.126 102.7)

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

#77B897

Mineral Blue · DarkSeaGreen · Olive Green

HEX
#77B897
RGB
rgb(119, 184, 151)
HSL
hsl(150, 31%, 59%)
HSB
hsb(150, 35%, 72%)
CMYK
cmyk(35%, 0%, 18%, 28%)
Oklch
oklch(72.9% 0.083 161.3)

Traditional「Mineral Blue」· Paint「Olive Green」· Creative Blush Sunrise

#429E8D

Mineral Blue · CadetBlue · Mint Ice

HEX
#429E8D
RGB
rgb(66, 158, 141)
HSL
hsl(169, 41%, 44%)
HSB
hsb(169, 58%, 62%)
CMYK
cmyk(58%, 0%, 11%, 38%)
Oklch
oklch(63.9% 0.091 179.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FF6B63
61F7FF

Analogous

FF61A8
FF6B63
FFB861

Triadic

FF6B63
61FF69
6961FF

Split-Comp.

FF6B63
61FFB8
61A8FF

Tetradic

FF6B63
A8FF61
61F7FF
B861FF

Contrast Matrix WCAG 2.1 Contrast

FF6B63
FF9763
DED26A
77B897
429E8D
—
1.3
Fail
1.8
Fail
1.2
Fail
1.2
Fail
1.3
Fail
—
1.4
Fail
1.1
Fail
1.5
Fail
1.8
Fail
1.4
Fail
—
1.5
Fail
2.1
Fail
1.2
Fail
1.1
Fail
1.5
Fail
—
1.4
Fail
1.2
Fail
1.5
Fail
2.1
Fail
1.4
Fail
—
White BG
2.8Fail
2.1Fail
1.6Fail
2.3Fail
3.2AA Large
Black BG
7.5AAA
9.9AAA
13.5AAA
9.1AAA
6.5AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

BFBE65
D2D170
D9D983
93949F
6A6B91

Deuteranopia

C8D365
D8E073
DADA89
8F8BA1
655E92

Tritanopia

F86667
FA7A7C
DD979B
7AA5A7
479495

Achromatopsia

969696
B0B0B0
CACACA
A1A1A1
818181

Shades & Tints Shades & Tints

#FF6B63

Dark
Light

#FF9763

Dark
Light

#DED26A

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ff6b63;
  --color-2: #ff9763;
  --color-3: #ded26a;
  --color-4: #77b897;
  --color-5: #429e8d;
}

SCSS

$color-1: #ff6b63;
$color-2: #ff9763;
$color-3: #ded26a;
$color-4: #77b897;
$color-5: #429e8d;

TAILWIND

colors: {
  'brand-1': '#ff6b63',
  'brand-2': '#ff9763',
  'brand-3': '#ded26a',
  'brand-4': '#77b897',
  'brand-5': '#429e8d',
}

RGB Array

[255, 107, 99], [255, 151, 99], [222, 210, 106], [119, 184, 151], [66, 158, 141]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FF6B63, #FF9763, #DED26A, #77B897, #429E8D 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: #ff6b63; --color-2: #ff9763; --color-3: #ded26a; --color-4: #77b897; --color-5: #429e8d. 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