← Back to Editor

#D7F6F6 · #73C5E3 · #F7540C · #FE1818 · #B3B4B7

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

#D7F6F6

Sky Blue · Lavender · Glacier Blue

HEX
#D7F6F6
RGB
rgb(215, 246, 246)
HSL
hsl(180, 63%, 90%)
HSB
hsb(180, 13%, 96%)
CMYK
cmyk(13%, 0%, 0%, 4%)
Oklch
oklch(95.1% 0.032 196.6)

Traditional「Sky Blue」· Paint「Glacier Blue」· Creative Arctic Pool

#73C5E3

Sky Blue · SkyBlue · Lake Green

HEX
#73C5E3
RGB
rgb(115, 197, 227)
HSL
hsl(196, 67%, 67%)
HSB
hsb(196, 49%, 89%)
CMYK
cmyk(49%, 13%, 0%, 11%)
Oklch
oklch(78.2% 0.091 223.7)

Traditional「Sky Blue」· Paint「Lake Green」· Creative Arctic Pool

#F7540C

Tangerine · OrangeRed · Warm Sun

HEX
#F7540C
RGB
rgb(247, 84, 12)
HSL
hsl(18, 94%, 51%)
HSB
hsb(18, 95%, 97%)
CMYK
cmyk(0%, 66%, 95%, 3%)
Oklch
oklch(66.2% 0.210 38.6)

Traditional「Tangerine」· Paint「Warm Sun」· Creative Blush Sunrise

#FE1818

Vermilion · Red · Passion Red

HEX
#FE1818
RGB
rgb(254, 24, 24)
HSL
hsl(0, 99%, 55%)
HSB
hsb(0, 91%, 100%)
CMYK
cmyk(0%, 91%, 91%, 0%)
Oklch
oklch(63.2% 0.251 28.5)

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

#B3B4B7

Silver Gray · Silver · Pearl Gray

HEX
#B3B4B7
RGB
rgb(179, 180, 183)
HSL
hsl(225, 3%, 71%)
HSB
hsb(225, 2%, 72%)
CMYK
cmyk(2%, 2%, 0%, 28%)
Oklch
oklch(77.0% 0.004 271.4)

Traditional「Silver Gray」· Paint「Pearl Gray」· Creative Silver Lining

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D7F6F6
F6D5D5

Analogous

D5F6E6
D7F6F6
D5E6F6

Triadic

D7F6F6
F6D5F6
F6F6D5

Split-Comp.

D7F6F6
F6D5E6
F6E6D5

Tetradic

D7F6F6
E6D5F6
F6D5D5
E6F6D5

Contrast Matrix WCAG 2.1 Contrast

D7F6F6
73C5E3
F7540C
FE1818
B3B4B7
—
1.7
Fail
3.0
Fail
3.4
AA Large
1.8
Fail
1.7
Fail
—
1.7
Fail
2.0
Fail
1.1
Fail
3.0
Fail
1.7
Fail
—
1.2
Fail
1.6
Fail
3.4
AA Large
2.0
Fail
1.2
Fail
—
1.9
Fail
1.8
Fail
1.1
Fail
1.6
Fail
1.9
Fail
—
White BG
1.1Fail
1.9Fail
3.4AA Large
3.9AA Large
2.1Fail
Black BG
18.4AAA
10.8AAA
6.2AA
5.4AA
10.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

E4E5F6
9797DC
B0AF1D
9A9818
B3B3B6

Deuteranopia

E3E0F6
928CDA
BAC622
A8B918
B3B3B6

Tritanopia

D9F6F6
77D6D5
EF2B2E
F21818
B3B6B6

Achromatopsia

EDEDED
B0B0B0
7D7D7D
5D5D5D
B4B4B4

Shades & Tints Shades & Tints

#D7F6F6

Dark
Light

#73C5E3

Dark
Light

#F7540C

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d7f6f6;
  --color-2: #73c5e3;
  --color-3: #f7540c;
  --color-4: #fe1818;
  --color-5: #b3b4b7;
}

SCSS

$color-1: #d7f6f6;
$color-2: #73c5e3;
$color-3: #f7540c;
$color-4: #fe1818;
$color-5: #b3b4b7;

TAILWIND

colors: {
  'brand-1': '#d7f6f6',
  'brand-2': '#73c5e3',
  'brand-3': '#f7540c',
  'brand-4': '#fe1818',
  'brand-5': '#b3b4b7',
}

RGB Array

[215, 246, 246], [115, 197, 227], [247, 84, 12], [254, 24, 24], [179, 180, 183]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D7F6F6, #73C5E3, #F7540C, #FE1818, #B3B4B7 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: #d7f6f6; --color-2: #73c5e3; --color-3: #f7540c; --color-4: #fe1818; --color-5: #b3b4b7. 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