← Back to Editor

#111A2B · #18424B · #79A156 · #DAFF61 · #FB685D

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

#111A2B

Indigo · Black · Deep Sea Blue

HEX
#111A2B
RGB
rgb(17, 26, 43)
HSL
hsl(219, 43%, 12%)
HSB
hsb(219, 60%, 17%)
CMYK
cmyk(60%, 40%, 0%, 83%)
Oklch
oklch(21.8% 0.036 262.5)

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

#18424B

Lake Blue · DarkSlateGray · Peacock Green

HEX
#18424B
RGB
rgb(24, 66, 75)
HSL
hsl(191, 52%, 19%)
HSB
hsb(191, 68%, 29%)
CMYK
cmyk(68%, 12%, 0%, 71%)
Oklch
oklch(35.4% 0.049 214.1)

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

#79A156

Celadon · Gray · Olive Green

HEX
#79A156
RGB
rgb(121, 161, 86)
HSL
hsl(92, 30%, 48%)
HSB
hsb(92, 47%, 63%)
CMYK
cmyk(25%, 0%, 47%, 37%)
Oklch
oklch(66.2% 0.112 131.8)

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

#DAFF61

Willow Green · Khaki · Apple Green

HEX
#DAFF61
RGB
rgb(218, 255, 97)
HSL
hsl(74, 100%, 69%)
HSB
hsb(74, 62%, 100%)
CMYK
cmyk(15%, 0%, 62%, 0%)
Oklch
oklch(94.4% 0.185 121.3)

Traditional「Willow Green」· Paint「Apple Green」· Creative Mint Breeze

#FB685D

Peach Pink · Tomato · Coral Red

HEX
#FB685D
RGB
rgb(251, 104, 93)
HSL
hsl(4, 95%, 67%)
HSB
hsb(4, 63%, 98%)
CMYK
cmyk(0%, 59%, 63%, 2%)
Oklch
oklch(69.9% 0.182 27.0)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

111A2B
2C2311

Analogous

11282C
111A2B
15112C

Triadic

111A2B
2C111B
1B2C11

Split-Comp.

111A2B
2C1511
282C11

Tetradic

111A2B
2C1128
2C2311
112C15

Contrast Matrix WCAG 2.1 Contrast

111A2B
18424B
79A156
DAFF61
FB685D
—
1.6
Fail
5.8
AA
15.3
AAA
6.0
AA
1.6
Fail
—
3.7
AA Large
9.6
AAA
3.8
AA Large
5.8
AA
3.7
AA Large
—
2.6
Fail
1.0
Fail
15.3
AAA
9.6
AAA
2.6
Fail
—
2.5
Fail
6.0
AA
3.8
AA Large
1.0
Fail
2.5
Fail
—
White BG
17.4AAA
10.9AAA
3.0Fail
1.1Fail
2.9Fail
Black BG
1.2Fail
1.9Fail
7.0AAA
18.5AAA
7.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

151527
2A2B49
8A8B68
EAEA87
BBBA60

Deuteranopia

141426
282548
88856D
E8E590
C4CF60

Tritanopia

112423
1A4747
7B767A
DCA5AC
F46262

Achromatopsia

191919
363636
8C8C8C
E2E2E2
939393

Shades & Tints Shades & Tints

#111A2B

Dark
Light

#18424B

Dark
Light

#79A156

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #111a2b;
  --color-2: #18424b;
  --color-3: #79a156;
  --color-4: #daff61;
  --color-5: #fb685d;
}

SCSS

$color-1: #111a2b;
$color-2: #18424b;
$color-3: #79a156;
$color-4: #daff61;
$color-5: #fb685d;

TAILWIND

colors: {
  'brand-1': '#111a2b',
  'brand-2': '#18424b',
  'brand-3': '#79a156',
  'brand-4': '#daff61',
  'brand-5': '#fb685d',
}

RGB Array

[17, 26, 43], [24, 66, 75], [121, 161, 86], [218, 255, 97], [251, 104, 93]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #111A2B, #18424B, #79A156, #DAFF61, #FB685D 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: #111a2b; --color-2: #18424b; --color-3: #79a156; --color-4: #daff61; --color-5: #fb685d. 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 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