← Back to Editor

#B5CC35 · #6FBF6F · #41BEA8 · #C7E2DD · #FE5F3E

cool

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#B5CC35

Autumn Sage · GreenYellow · Honey Gold

HEX
#B5CC35
RGB
rgb(181, 204, 53)
HSL
hsl(69, 60%, 50%)
HSB
hsb(69, 74%, 80%)
CMYK
cmyk(11%, 0%, 74%, 20%)
Oklch
oklch(80.2% 0.169 118.1)

TraditionalAutumn Sage」· PaintHoney Gold」· Creative Blush Sunrise

#6FBF6F

Celadon · DarkSeaGreen · Olive Green

HEX
#6FBF6F
RGB
rgb(111, 191, 111)
HSL
hsl(120, 38%, 59%)
HSB
hsb(120, 42%, 75%)
CMYK
cmyk(42%, 0%, 42%, 25%)
Oklch
oklch(73.4% 0.138 144.0)

TraditionalCeladon」· PaintOlive Green」· Creative Blush Sunrise

#41BEA8

Mineral Blue · LightSeaGreen · Mint Ice

HEX
#41BEA8
RGB
rgb(65, 190, 168)
HSL
hsl(169, 49%, 50%)
HSB
hsb(169, 66%, 75%)
CMYK
cmyk(66%, 0%, 12%, 25%)
Oklch
oklch(72.7% 0.114 178.9)

TraditionalMineral Blue」· PaintMint Ice」· Creative Blush Sunrise

#C7E2DD

Jade · LightGray · Glacier Blue

HEX
#C7E2DD
RGB
rgb(199, 226, 221)
HSL
hsl(169, 32%, 83%)
HSB
hsb(169, 12%, 89%)
CMYK
cmyk(12%, 0%, 2%, 11%)
Oklch
oklch(89.2% 0.029 183.3)

TraditionalJade」· PaintGlacier Blue」· Creative Arctic Pool

#FE5F3E

Peach Pink · Tomato · Coral Red

HEX
#FE5F3E
RGB
rgb(254, 95, 62)
HSL
hsl(10, 99%, 62%)
HSB
hsb(10, 76%, 100%)
CMYK
cmyk(0%, 63%, 76%, 0%)
Oklch
oklch(68.9% 0.200 33.5)

TraditionalPeach Pink」· PaintCoral Red」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

B5CC35
4A33CC

Analogous

CC9633
B5CC35
69CC33

Triadic

B5CC35
33B5CC
CC33B5

Split-Comp.

B5CC35
3369CC
9633CC

Tetradic

B5CC35
33CC96
4A33CC
CC3369

Contrast Matrix WCAG 2.1 Contrast

B5CC35
6FBF6F
41BEA8
C7E2DD
FE5F3E
1.2
Fail
1.3
Fail
1.3
Fail
1.7
Fail
1.2
Fail
1.0
Fail
1.6
Fail
1.4
Fail
1.3
Fail
1.0
Fail
1.7
Fail
1.3
Fail
1.3
Fail
1.6
Fail
1.7
Fail
2.2
Fail
1.7
Fail
1.4
Fail
1.3
Fail
2.2
Fail
White BG
1.8Fail
2.2Fail
2.3Fail
1.4Fail
3.0AA Large
Black BG
11.7AAA
9.4AAA
9.2AAA
15.4AAA
6.9AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

BFBF5A
929282
7778AD
D3D3DE
B9B846

Deuteranopia

BEBC62
8D8787
7067AF
D1CFDF
C2CE48

Tritanopia

B6767D
739295
47B2B2
C8DFDF
F64C4E

Achromatopsia

B4B4B4
9E9E9E
969696
D9D9D9
8B8B8B

Shades & Tints Shades & Tints

#B5CC35

Dark
Light

#6FBF6F

Dark
Light

#41BEA8

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #b5cc35;
  --color-2: #6fbf6f;
  --color-3: #41bea8;
  --color-4: #c7e2dd;
  --color-5: #fe5f3e;
}

SCSS

$color-1: #b5cc35;
$color-2: #6fbf6f;
$color-3: #41bea8;
$color-4: #c7e2dd;
$color-5: #fe5f3e;

TAILWIND

colors: {
  'brand-1': '#b5cc35',
  'brand-2': '#6fbf6f',
  'brand-3': '#41bea8',
  'brand-4': '#c7e2dd',
  'brand-5': '#fe5f3e',
}

RGB Array

[181, 204, 53], [111, 191, 111], [65, 190, 168], [199, 226, 221], [254, 95, 62]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This cool-style palette of #B5CC35, #6FBF6F, #41BEA8, #C7E2DD, #FE5F3E is ideal for: corporate websites, product showcases, portfolios. It is a balanced and harmonious choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #b5cc35; --color-2: #6fbf6f; --color-3: #41bea8; --color-4: #c7e2dd; --color-5: #fe5f3e. 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. 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 tech, SaaS, healthcare, eco industries. 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