← Back to Editor

#FF144B · #F7867C · #FCB786 · #C5DEC3 · #7DF0E4

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

#FF144B

Vermilion · Crimson · Passion Red

HEX
#FF144B
RGB
rgb(255, 20, 75)
HSL
hsl(346, 100%, 54%)
HSB
hsb(346, 92%, 100%)
CMYK
cmyk(0%, 92%, 71%, 0%)
Oklch
oklch(63.8% 0.250 18.8)

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

#F7867C

Peach Pink · LightCoral · Coral Red

HEX
#F7867C
RGB
rgb(247, 134, 124)
HSL
hsl(5, 88%, 73%)
HSB
hsb(5, 50%, 97%)
CMYK
cmyk(0%, 46%, 50%, 3%)
Oklch
oklch(74.2% 0.139 26.2)

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

#FCB786

Apricot · LightSalmon · Peach Orange

HEX
#FCB786
RGB
rgb(252, 183, 134)
HSL
hsl(25, 95%, 76%)
HSB
hsb(25, 47%, 99%)
CMYK
cmyk(0%, 27%, 47%, 1%)
Oklch
oklch(83.3% 0.103 56.2)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

#C5DEC3

Celadon · LightGray · Mint Green

HEX
#C5DEC3
RGB
rgb(197, 222, 195)
HSL
hsl(116, 29%, 82%)
HSB
hsb(116, 12%, 87%)
CMYK
cmyk(11%, 0%, 12%, 13%)
Oklch
oklch(87.5% 0.045 143.2)

Traditional「Celadon」· Paint「Mint Green」· Creative Mint Breeze

#7DF0E4

Jade · SkyBlue · Lake Green

HEX
#7DF0E4
RGB
rgb(125, 240, 228)
HSL
hsl(174, 79%, 72%)
HSB
hsb(174, 48%, 94%)
CMYK
cmyk(48%, 0%, 5%, 6%)
Oklch
oklch(88.4% 0.107 186.6)

Traditional「Jade」· Paint「Lake Green」· Creative Arctic Pool

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FF144B
14FFC8

Analogous

FF14C0
FF144B
FF5314

Triadic

FF144B
4BFF14
144BFF

Split-Comp.

FF144B
14FF53
14C0FF

Tetradic

FF144B
C0FF14
14FFC8
5314FF

Contrast Matrix WCAG 2.1 Contrast

FF144B
F7867C
FCB786
C5DEC3
7DF0E4
—
1.6
Fail
2.2
Fail
2.7
Fail
2.8
Fail
1.6
Fail
—
1.4
Fail
1.7
Fail
1.8
Fail
2.2
Fail
1.4
Fail
—
1.2
Fail
1.3
Fail
2.7
Fail
1.7
Fail
1.2
Fail
—
1.1
Fail
2.8
Fail
1.8
Fail
1.3
Fail
1.1
Fail
—
White BG
3.9AA Large
2.4Fail
1.7Fail
1.4Fail
1.4Fail
Black BG
5.5AA
8.7AAA
12.3AAA
14.6AAA
15.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

99973E
C6C57E
DEDE92
D0D0CA
AFB0E7

Deuteranopia

A7B93B
CDD57F
E2E795
CECCCB
A8A0E8

Tritanopia

F33331
F18081
F99B9D
C6CFD0
83E9EA

Achromatopsia

616161
A7A7A7
C6C6C6
D3D3D3
CCCCCC

Shades & Tints Shades & Tints

#FF144B

Dark
Light

#F7867C

Dark
Light

#FCB786

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ff144b;
  --color-2: #f7867c;
  --color-3: #fcb786;
  --color-4: #c5dec3;
  --color-5: #7df0e4;
}

SCSS

$color-1: #ff144b;
$color-2: #f7867c;
$color-3: #fcb786;
$color-4: #c5dec3;
$color-5: #7df0e4;

TAILWIND

colors: {
  'brand-1': '#ff144b',
  'brand-2': '#f7867c',
  'brand-3': '#fcb786',
  'brand-4': '#c5dec3',
  'brand-5': '#7df0e4',
}

RGB Array

[255, 20, 75], [247, 134, 124], [252, 183, 134], [197, 222, 195], [125, 240, 228]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FF144B, #F7867C, #FCB786, #C5DEC3, #7DF0E4 is ideal for: social media posters, mobile apps, e-commerce promos, health products, baby brands, fresh-style blogs. 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: #ff144b; --color-2: #f7867c; --color-3: #fcb786; --color-4: #c5dec3; --color-5: #7df0e4. 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?

Light tones suit backgrounds; use dark colors for body text. Mid-tones work for card backgrounds or dividers to add depth. 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