← Back to Editor

#141641 · #135269 · #E85657 · #F5B704 · #487F47

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

#141641

Indigo · MidnightBlue · Deep Sea Blue

HEX
#141641
RGB
rgb(20, 22, 65)
HSL
hsl(237, 53%, 17%)
HSB
hsb(237, 69%, 25%)
CMYK
cmyk(69%, 66%, 0%, 75%)
Oklch
oklch(22.9% 0.080 276.0)

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

#135269

Lake Blue · DarkSlateGray · Peacock Green

HEX
#135269
RGB
rgb(19, 82, 105)
HSL
hsl(196, 69%, 24%)
HSB
hsb(196, 82%, 41%)
CMYK
cmyk(82%, 22%, 0%, 59%)
Oklch
oklch(41.1% 0.072 227.6)

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

#E85657

Peach Pink · Tomato · Coral Red

HEX
#E85657
RGB
rgb(232, 86, 87)
HSL
hsl(360, 76%, 62%)
HSB
hsb(360, 63%, 91%)
CMYK
cmyk(0%, 63%, 63%, 9%)
Oklch
oklch(64.8% 0.181 23.3)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Soft Aurora

#F5B704

Ochre · Orange · Honey Gold

HEX
#F5B704
RGB
rgb(245, 183, 4)
HSL
hsl(45, 97%, 49%)
HSB
hsb(45, 98%, 96%)
CMYK
cmyk(0%, 25%, 98%, 4%)
Oklch
oklch(81.5% 0.167 83.8)

Traditional「Ochre」· Paint「Honey Gold」· Creative Blush Sunrise

#487F47

Celadon · SeaGreen · Forest Green

HEX
#487F47
RGB
rgb(72, 127, 71)
HSL
hsl(119, 28%, 39%)
HSB
hsb(119, 44%, 50%)
CMYK
cmyk(43%, 0%, 44%, 50%)
Oklch
oklch(54.4% 0.103 143.6)

Traditional「Celadon」· Paint「Forest Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

141641
424014

Analogous

142E42
141641
291442

Triadic

141641
421417
174214

Split-Comp.

141641
422914
2E4214

Tetradic

141641
42142E
424014
144229

Contrast Matrix WCAG 2.1 Contrast

141641
135269
E85657
F5B704
487F47
—
2.0
Fail
4.8
AA
9.5
AAA
3.6
AA Large
2.0
Fail
—
2.4
Fail
4.8
AA
1.8
Fail
4.8
AA
2.4
Fail
—
2.0
Fail
1.3
Fail
9.5
AAA
4.8
AA
2.0
Fail
—
2.6
Fail
3.6
AA Large
1.8
Fail
1.3
Fail
2.6
Fail
—
White BG
17.2AAA
8.6AAA
3.6AA Large
1.8Fail
4.8AA
Black BG
1.2Fail
2.4Fail
5.9AA
11.7AAA
4.4AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

151537
2E2F63
A9A757
DADA2F
606055

Deuteranopia

151534
2B2662
B1BC57
DEE23A
5D5958

Tritanopia

142E2D
165F5E
E15757
F25259
4B5F62

Achromatopsia

1A1A1A
424242
828282
B5B5B5
686868

Shades & Tints Shades & Tints

#141641

Dark
Light

#135269

Dark
Light

#E85657

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #141641;
  --color-2: #135269;
  --color-3: #e85657;
  --color-4: #f5b704;
  --color-5: #487f47;
}

SCSS

$color-1: #141641;
$color-2: #135269;
$color-3: #e85657;
$color-4: #f5b704;
$color-5: #487f47;

TAILWIND

colors: {
  'brand-1': '#141641',
  'brand-2': '#135269',
  'brand-3': '#e85657',
  'brand-4': '#f5b704',
  'brand-5': '#487f47',
}

RGB Array

[20, 22, 65], [19, 82, 105], [232, 86, 87], [245, 183, 4], [72, 127, 71]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This bright-style palette of #141641, #135269, #E85657, #F5B704, #487F47 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: #141641; --color-2: #135269; --color-3: #e85657; --color-4: #f5b704; --color-5: #487f47. 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 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