← Back to Editor

#BFC5C5 · #041028 · #C1AC4F · #004861 · #0090AD

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 AppData Visualization

Color Details Color Details

#BFC5C5

Silver Gray · Silver · Pearl Gray

HEX
#BFC5C5
RGB
rgb(191, 197, 197)
HSL
hsl(180, 5%, 76%)
HSB
hsb(180, 3%, 77%)
CMYK
cmyk(3%, 0%, 0%, 23%)
Oklch
oklch(81.9% 0.007 197.0)

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

#041028

Indigo · Black · Deep Sea Blue

HEX
#041028
RGB
rgb(4, 16, 40)
HSL
hsl(220, 82%, 9%)
HSB
hsb(220, 90%, 16%)
CMYK
cmyk(90%, 60%, 0%, 84%)
Oklch
oklch(17.8% 0.053 260.8)

Traditional「Indigo」· Paint「Deep Sea Blue」· Creative Blush Sunrise

#C1AC4F

Ginger · GoldenRod · Sunflower

HEX
#C1AC4F
RGB
rgb(193, 172, 79)
HSL
hsl(49, 48%, 53%)
HSB
hsb(49, 59%, 76%)
CMYK
cmyk(0%, 11%, 59%, 24%)
Oklch
oklch(74.4% 0.116 96.7)

Traditional「Ginger」· Paint「Sunflower」· Creative Blush Sunrise

#004861

Lake Blue · DarkSlateGray · Peacock Green

HEX
#004861
RGB
rgb(0, 72, 97)
HSL
hsl(195, 100%, 19%)
HSB
hsb(195, 100%, 38%)
CMYK
cmyk(100%, 26%, 0%, 62%)
Oklch
oklch(37.6% 0.075 229.8)

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

#0090AD

Lake Blue · LightSeaGreen · Mint Ice

HEX
#0090AD
RGB
rgb(0, 144, 173)
HSL
hsl(190, 100%, 34%)
HSB
hsb(190, 100%, 68%)
CMYK
cmyk(100%, 17%, 0%, 32%)
Oklch
oklch(60.4% 0.109 218.7)

Traditional「Lake Blue」· Paint「Mint Ice」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

BFC5C5
C5BFBF

Analogous

BFC5C2
BFC5C5
BFC2C5

Triadic

BFC5C5
C5BFC5
C5C5BF

Split-Comp.

BFC5C5
C5BFC2
C5C2BF

Tetradic

BFC5C5
C2BFC5
C5BFBF
C2C5BF

Contrast Matrix WCAG 2.1 Contrast

BFC5C5
041028
C1AC4F
004861
0090AD
—
10.8
AAA
1.3
Fail
5.7
AA
2.1
Fail
10.8
AAA
—
8.4
AAA
1.9
Fail
5.0
AA
1.3
Fail
8.4
AAA
—
4.4
AA Large
1.7
Fail
5.7
AA
1.9
Fail
4.4
AA Large
—
2.7
Fail
2.1
Fail
5.0
AA
1.7
Fail
2.7
Fail
—
White BG
1.7Fail
18.9AAA
2.3Fail
10.0AAA
3.8AA Large
Black BG
12.0AAA
1.1Fail
9.3AAA
2.1Fail
5.6AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

C2C2C5
090922
B8B866
1F205B
3E40A6

Deuteranopia

C1C1C5
090821
B9BB6B
1B1659
362BA4

Tritanopia

BFC5C5
051E1D
C0777B
045655
07A09F

Achromatopsia

C3C3C3
0F0F0F
A8A8A8
353535
686868

Shades & Tints Shades & Tints

#BFC5C5

Dark
Light

#041028

Dark
Light

#C1AC4F

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #bfc5c5;
  --color-2: #041028;
  --color-3: #c1ac4f;
  --color-4: #004861;
  --color-5: #0090ad;
}

SCSS

$color-1: #bfc5c5;
$color-2: #041028;
$color-3: #c1ac4f;
$color-4: #004861;
$color-5: #0090ad;

TAILWIND

colors: {
  'brand-1': '#bfc5c5',
  'brand-2': '#041028',
  'brand-3': '#c1ac4f',
  'brand-4': '#004861',
  'brand-5': '#0090ad',
}

RGB Array

[191, 197, 197], [4, 16, 40], [193, 172, 79], [0, 72, 97], [0, 144, 173]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #BFC5C5, #041028, #C1AC4F, #004861, #0090AD is ideal for: social media posters, mobile apps, e-commerce promos, tech websites, dark mode UIs, game UIs, 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: #bfc5c5; --color-2: #041028; --color-3: #c1ac4f; --color-4: #004861; --color-5: #0090ad. 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?

Dark tones work well as backgrounds; pair with light text for readability. Use the brightest color for CTA buttons and interactive elements. 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 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