← Back to Editor

#1C74BB · #F0266F · #FB9010 · #C4D016 · #FFF0D6

bright

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarmCool

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial AppData Visualization

Color Details Color Details

#1C74BB

Lake Blue · SteelBlue · Navy Blue

HEX
#1C74BB
RGB
rgb(28, 116, 187)
HSL
hsl(207, 74%, 42%)
HSB
hsb(207, 85%, 73%)
CMYK
cmyk(85%, 38%, 0%, 27%)
Oklch
oklch(54.6% 0.136 248.5)

Traditional「Lake Blue」· Paint「Navy Blue」· Creative Blush Sunrise

#F0266F

Dark Violet · DeepPink · Rose Pink

HEX
#F0266F
RGB
rgb(240, 38, 111)
HSL
hsl(338, 87%, 55%)
HSB
hsb(338, 84%, 94%)
CMYK
cmyk(0%, 84%, 54%, 6%)
Oklch
oklch(62.5% 0.233 7.1)

Traditional「Dark Violet」· Paint「Rose Pink」· Creative Blush Sunrise

#FB9010

Ginger · Orange · Warm Sun

HEX
#FB9010
RGB
rgb(251, 144, 16)
HSL
hsl(33, 97%, 52%)
HSB
hsb(33, 94%, 98%)
CMYK
cmyk(0%, 43%, 94%, 2%)
Oklch
oklch(75.2% 0.172 60.6)

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

#C4D016

Autumn Sage · GoldenRod · Honey Gold

HEX
#C4D016
RGB
rgb(196, 208, 22)
HSL
hsl(64, 81%, 45%)
HSB
hsb(64, 89%, 82%)
CMYK
cmyk(6%, 0%, 89%, 18%)
Oklch
oklch(82.1% 0.181 113.9)

Traditional「Autumn Sage」· Paint「Honey Gold」· Creative Blush Sunrise

#FFF0D6

Goose Yellow · Beige · Peach Orange

HEX
#FFF0D6
RGB
rgb(255, 240, 214)
HSL
hsl(38, 100%, 92%)
HSB
hsb(38, 16%, 100%)
CMYK
cmyk(0%, 6%, 16%, 0%)
Oklch
oklch(96.0% 0.038 81.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

1C74BB
BA631C

Analogous

1CBAB2
1C74BB
1C24BA

Triadic

1C74BB
BA1C73
73BA1C

Split-Comp.

1C74BB
BA1C24
BAB21C

Tetradic

1C74BB
B21CBA
BA631C
24BA1C

Contrast Matrix WCAG 2.1 Contrast

1C74BB
F0266F
FB9010
C4D016
FFF0D6
—
1.2
Fail
2.1
Fail
2.9
Fail
4.4
AA Large
1.2
Fail
—
1.7
Fail
2.4
Fail
3.6
AA Large
2.1
Fail
1.7
Fail
—
1.4
Fail
2.1
Fail
2.9
Fail
2.4
Fail
1.4
Fail
—
1.5
Fail
4.4
AA Large
3.6
AA Large
2.1
Fail
1.5
Fail
—
White BG
4.9AA
4.0AA Large
2.3Fail
1.7Fail
1.1Fail
Black BG
4.3AA Large
5.2AA
9.1AAA
12.4AAA
18.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

4243AA
99975D
CDCC2F
C9C943
F9F8DC

Deuteranopia

3D36A6
A4B359
D3DB36
C9C84E
F9FBDE

Tritanopia

209C99
E64F4C
F6474D
C5676E
FEE1E2

Achromatopsia

626262
6B6B6B
A1A1A1
B7B7B7
F2F2F2

Shades & Tints Shades & Tints

#1C74BB

Dark
Light

#F0266F

Dark
Light

#FB9010

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #1c74bb;
  --color-2: #f0266f;
  --color-3: #fb9010;
  --color-4: #c4d016;
  --color-5: #fff0d6;
}

SCSS

$color-1: #1c74bb;
$color-2: #f0266f;
$color-3: #fb9010;
$color-4: #c4d016;
$color-5: #fff0d6;

TAILWIND

colors: {
  'brand-1': '#1c74bb',
  'brand-2': '#f0266f',
  'brand-3': '#fb9010',
  'brand-4': '#c4d016',
  'brand-5': '#fff0d6',
}

RGB Array

[28, 116, 187], [240, 38, 111], [251, 144, 16], [196, 208, 22], [255, 240, 214]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This bright-style palette of #1C74BB, #F0266F, #FB9010, #C4D016, #FFF0D6 is ideal for: social media posters, mobile apps, e-commerce promos, infographics, data visualization, accessible design. Vivid colors effectively attract user attention. High contrast ensures clear visual hierarchy and readability. 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: #1c74bb; --color-2: #f0266f; --color-3: #fb9010; --color-4: #c4d016; --color-5: #fff0d6. 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. High-contrast palettes naturally meet WCAG accessibility standards. 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 bright-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