← Back to Editor

#F64A60 · #FBB367 · #F87750 · #C2757B · #6BBBB0

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

#F64A60

Peach Pink · Tomato · Coral Red

HEX
#F64A60
RGB
rgb(246, 74, 96)
HSL
hsl(352, 91%, 63%)
HSB
hsb(352, 70%, 96%)
CMYK
cmyk(0%, 70%, 61%, 4%)
Oklch
oklch(65.9% 0.207 17.9)

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

#FBB367

Ginger · SandyBrown · Warm Sun

HEX
#FBB367
RGB
rgb(251, 179, 103)
HSL
hsl(31, 95%, 69%)
HSB
hsb(31, 59%, 98%)
CMYK
cmyk(0%, 29%, 59%, 2%)
Oklch
oklch(82.0% 0.125 66.0)

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

#F87750

Peach Pink · Coral · Coral Red

HEX
#F87750
RGB
rgb(248, 119, 80)
HSL
hsl(14, 92%, 64%)
HSB
hsb(14, 68%, 97%)
CMYK
cmyk(0%, 52%, 68%, 3%)
Oklch
oklch(71.4% 0.167 37.5)

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

#C2757B

Peach Pink · LightCoral · Coral Red

HEX
#C2757B
RGB
rgb(194, 117, 123)
HSL
hsl(355, 39%, 61%)
HSB
hsb(355, 40%, 76%)
CMYK
cmyk(0%, 40%, 37%, 24%)
Oklch
oklch(64.7% 0.097 15.1)

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

#6BBBB0

Mineral Blue · MediumAquaMarine · Lake Green

HEX
#6BBBB0
RGB
rgb(107, 187, 176)
HSL
hsl(172, 37%, 58%)
HSB
hsb(172, 43%, 73%)
CMYK
cmyk(43%, 0%, 6%, 27%)
Oklch
oklch(73.8% 0.081 184.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F64A60
4BF7E0

Analogous

F74BB8
F64A60
F78A4B

Triadic

F64A60
62F74B
4B62F7

Split-Comp.

F64A60
4BF78A
4BB8F7

Tetradic

F64A60
B8F74B
4BF7E0
8A4BF7

Contrast Matrix WCAG 2.1 Contrast

F64A60
FBB367
F87750
C2757B
6BBBB0
—
1.9
Fail
1.3
Fail
1.0
Fail
1.5
Fail
1.9
Fail
—
1.5
Fail
1.9
Fail
1.3
Fail
1.3
Fail
1.5
Fail
—
1.3
Fail
1.2
Fail
1.0
Fail
1.9
Fail
1.3
Fail
—
1.5
Fail
1.5
Fail
1.3
Fail
1.2
Fail
1.5
Fail
—
White BG
3.5AA Large
1.8Fail
2.7Fail
3.4AA Large
2.2Fail
Black BG
6.1AA
11.7AAA
7.7AAA
6.1AA
9.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

ACAA5B
DCDB79
C0BF59
A1A07A
8E8EB3

Deuteranopia

B6C259
E0E57E
C8D15C
A5AB79
8983B3

Tritanopia

ED5656
F7888B
F26163
BE7878
6FB5B5

Achromatopsia

808080
C0C0C0
999999
8D8D8D
A2A2A2

Shades & Tints Shades & Tints

#F64A60

Dark
Light

#FBB367

Dark
Light

#F87750

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f64a60;
  --color-2: #fbb367;
  --color-3: #f87750;
  --color-4: #c2757b;
  --color-5: #6bbbb0;
}

SCSS

$color-1: #f64a60;
$color-2: #fbb367;
$color-3: #f87750;
$color-4: #c2757b;
$color-5: #6bbbb0;

TAILWIND

colors: {
  'brand-1': '#f64a60',
  'brand-2': '#fbb367',
  'brand-3': '#f87750',
  'brand-4': '#c2757b',
  'brand-5': '#6bbbb0',
}

RGB Array

[246, 74, 96], [251, 179, 103], [248, 119, 80], [194, 117, 123], [107, 187, 176]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F64A60, #FBB367, #F87750, #C2757B, #6BBBB0 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: #f64a60; --color-2: #fbb367; --color-3: #f87750; --color-4: #c2757b; --color-5: #6bbbb0. 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