← Back to Editor

#FABF61 · #07A5B9 · #7E5B08 · #06444B · #1B0225

cool

A 5-color cool 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

#FABF61

Ginger · SandyBrown · Warm Sun

HEX
#FABF61
RGB
rgb(250, 191, 97)
HSL
hsl(37, 94%, 68%)
HSB
hsb(37, 61%, 98%)
CMYK
cmyk(0%, 24%, 61%, 2%)
Oklch
oklch(84.0% 0.130 77.0)

Traditional「Ginger」· Paint「Warm Sun」· Creative Honey Glow

#07A5B9

Lake Blue · LightSeaGreen · Mint Ice

HEX
#07A5B9
RGB
rgb(7, 165, 185)
HSL
hsl(187, 93%, 38%)
HSB
hsb(187, 96%, 73%)
CMYK
cmyk(96%, 11%, 0%, 27%)
Oklch
oklch(66.2% 0.114 210.0)

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

#7E5B08

Ochre · Olive · Honey Gold

HEX
#7E5B08
RGB
rgb(126, 91, 8)
HSL
hsl(42, 88%, 26%)
HSB
hsb(42, 94%, 49%)
CMYK
cmyk(0%, 28%, 94%, 51%)
Oklch
oklch(49.5% 0.099 81.6)

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

#06444B

Lake Blue · DarkSlateGray · Peacock Green

HEX
#06444B
RGB
rgb(6, 68, 75)
HSL
hsl(186, 85%, 16%)
HSB
hsb(186, 92%, 29%)
CMYK
cmyk(92%, 9%, 0%, 71%)
Oklch
oklch(35.4% 0.058 207.0)

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

#1B0225

Royal Purple · Black · Dark Purple

HEX
#1B0225
RGB
rgb(27, 2, 37)
HSL
hsl(283, 90%, 8%)
HSB
hsb(283, 95%, 15%)
CMYK
cmyk(27%, 95%, 0%, 85%)
Oklch
oklch(17.0% 0.075 315.0)

Traditional「Royal Purple」· Paint「Dark Purple」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FABF61
619CFA

Analogous

FA7361
FABF61
E8FA61

Triadic

FABF61
61FABF
BF61FA

Split-Comp.

FABF61
61E8FA
7361FA

Tetradic

FABF61
61FA73
619CFA
FA61E8

Contrast Matrix WCAG 2.1 Contrast

FABF61
07A5B9
7E5B08
06444B
1B0225
—
1.8
Fail
3.7
AA Large
6.6
AA
11.7
AAA
1.8
Fail
—
2.1
Fail
3.7
AA Large
6.6
AA
3.7
AA Large
2.1
Fail
—
1.7
Fail
3.1
AA Large
6.6
AA
3.7
AA Large
1.7
Fail
—
1.8
Fail
11.7
AAA
6.6
AA
3.1
AA Large
1.8
Fail
—
White BG
1.7Fail
3.0Fail
6.2AA
10.8AAA
19.4AAA
Black BG
12.7AAA
7.1AAA
3.4AA Large
1.9Fail
1.1Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

E0E078
4B4DB4
6F6F1C
212149
10101D

Deuteranopia

E4E87D
4236B3
717321
1D1949
12141B

Tritanopia

F78A8E
0FB0B0
7C2C2F
094848
1A1614

Achromatopsia

C6C6C6
787878
5C5C5C
323232
0D0D0D

Shades & Tints Shades & Tints

#FABF61

Dark
Light

#07A5B9

Dark
Light

#7E5B08

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fabf61;
  --color-2: #07a5b9;
  --color-3: #7e5b08;
  --color-4: #06444b;
  --color-5: #1b0225;
}

SCSS

$color-1: #fabf61;
$color-2: #07a5b9;
$color-3: #7e5b08;
$color-4: #06444b;
$color-5: #1b0225;

TAILWIND

colors: {
  'brand-1': '#fabf61',
  'brand-2': '#07a5b9',
  'brand-3': '#7e5b08',
  'brand-4': '#06444b',
  'brand-5': '#1b0225',
}

RGB Array

[250, 191, 97], [7, 165, 185], [126, 91, 8], [6, 68, 75], [27, 2, 37]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This cool-style palette of #FABF61, #07A5B9, #7E5B08, #06444B, #1B0225 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: #fabf61; --color-2: #07a5b9; --color-3: #7e5b08; --color-4: #06444b; --color-5: #1b0225. 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 cool-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