← Back to Editor

#F7FDFA · #9EE0BF · #F15FB1 · #F1A75F · #FAF8F6

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

#F7FDFA

Jade · Snow · Mint Green

HEX
#F7FDFA
RGB
rgb(247, 253, 250)
HSL
hsl(150, 60%, 98%)
HSB
hsb(150, 2%, 99%)
CMYK
cmyk(2%, 0%, 1%, 1%)
Oklch
oklch(98.9% 0.007 164.9)

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

#9EE0BF

Jade · LightBlue · Apple Green

HEX
#9EE0BF
RGB
rgb(158, 224, 191)
HSL
hsl(150, 52%, 75%)
HSB
hsb(150, 29%, 88%)
CMYK
cmyk(29%, 0%, 15%, 12%)
Oklch
oklch(85.3% 0.081 162.3)

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

#F15FB1

Mauve · Orchid · Rose Pink

HEX
#F15FB1
RGB
rgb(241, 95, 177)
HSL
hsl(326, 84%, 66%)
HSB
hsb(326, 61%, 95%)
CMYK
cmyk(0%, 61%, 27%, 5%)
Oklch
oklch(69.6% 0.198 348.7)

Traditional「Mauve」· Paint「Rose Pink」· Creative Rose Petal

#F1A75F

Ginger · SandyBrown · Warm Sun

HEX
#F1A75F
RGB
rgb(241, 167, 95)
HSL
hsl(30, 84%, 66%)
HSB
hsb(30, 61%, 95%)
CMYK
cmyk(0%, 31%, 61%, 5%)
Oklch
oklch(78.6% 0.124 63.5)

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

#FAF8F6

Goose Yellow · Snow · Peach Orange

HEX
#FAF8F6
RGB
rgb(250, 248, 246)
HSL
hsl(30, 29%, 97%)
HSB
hsb(30, 2%, 98%)
CMYK
cmyk(0%, 1%, 2%, 2%)
Oklch
oklch(98.0% 0.003 67.8)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F7FDFA
FDF7FA

Analogous

F7FDF7
F7FDFA
F7FDFD

Triadic

F7FDFA
FAF7FD
FDFAF7

Split-Comp.

F7FDFA
FDF7FD
FDF7F7

Tetradic

F7FDFA
F7F7FD
FDF7FA
FDFDF7

Contrast Matrix WCAG 2.1 Contrast

F7FDFA
9EE0BF
F15FB1
F1A75F
FAF8F6
—
1.5
Fail
2.9
Fail
2.0
Fail
1.0
Fail
1.5
Fail
—
2.0
Fail
1.3
Fail
1.4
Fail
2.9
Fail
2.0
Fail
—
1.5
Fail
2.8
Fail
2.0
Fail
1.3
Fail
1.5
Fail
—
1.9
Fail
1.0
Fail
1.4
Fail
2.8
Fail
1.9
Fail
—
White BG
1.0Fail
1.5Fail
3.0Fail
2.0Fail
1.1Fail
Black BG
20.4AAA
13.9AAA
7.0AAA
10.4AAA
19.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

FAFAFB
BBBBC7
B2B09D
D1D070
F9F9F6

Deuteranopia

F9F9FB
B7B2C9
BAC598
D5DB75
F9F9F7

Tritanopia

F7FBFB
A1CDCF
EA8D8A
ED7E81
FAF7F7

Achromatopsia

FBFBFB
C9C9C9
949494
B5B5B5
F8F8F8

Shades & Tints Shades & Tints

#F7FDFA

Dark
Light

#9EE0BF

Dark
Light

#F15FB1

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f7fdfa;
  --color-2: #9ee0bf;
  --color-3: #f15fb1;
  --color-4: #f1a75f;
  --color-5: #faf8f6;
}

SCSS

$color-1: #f7fdfa;
$color-2: #9ee0bf;
$color-3: #f15fb1;
$color-4: #f1a75f;
$color-5: #faf8f6;

TAILWIND

colors: {
  'brand-1': '#f7fdfa',
  'brand-2': '#9ee0bf',
  'brand-3': '#f15fb1',
  'brand-4': '#f1a75f',
  'brand-5': '#faf8f6',
}

RGB Array

[247, 253, 250], [158, 224, 191], [241, 95, 177], [241, 167, 95], [250, 248, 246]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F7FDFA, #9EE0BF, #F15FB1, #F1A75F, #FAF8F6 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: #f7fdfa; --color-2: #9ee0bf; --color-3: #f15fb1; --color-4: #f1a75f; --color-5: #faf8f6. 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