← Back to Editor

#00C0DC · #008785 · #9AFF41 · #6BB32D · #2B2B2B

summer

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

#00C0DC

Lake Blue · DarkTurquoise · Mint Ice

HEX
#00C0DC
RGB
rgb(0, 192, 220)
HSL
hsl(188, 100%, 43%)
HSB
hsb(188, 100%, 86%)
CMYK
cmyk(100%, 13%, 0%, 14%)
Oklch
oklch(74.2% 0.130 213.0)

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

#008785

Mineral Blue · Teal · Mint Ice

HEX
#008785
RGB
rgb(0, 135, 133)
HSL
hsl(179, 100%, 26%)
HSB
hsb(179, 100%, 53%)
CMYK
cmyk(100%, 0%, 1%, 47%)
Oklch
oklch(56.4% 0.097 192.9)

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

#9AFF41

Emerald · GreenYellow · Apple Green

HEX
#9AFF41
RGB
rgb(154, 255, 65)
HSL
hsl(92, 100%, 63%)
HSB
hsb(92, 75%, 100%)
CMYK
cmyk(40%, 0%, 75%, 0%)
Oklch
oklch(90.4% 0.235 133.9)

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

#6BB32D

Pine Green · LimeGreen · Olive Green

HEX
#6BB32D
RGB
rgb(107, 179, 45)
HSL
hsl(92, 60%, 44%)
HSB
hsb(92, 75%, 70%)
CMYK
cmyk(40%, 0%, 75%, 30%)
Oklch
oklch(69.4% 0.178 134.0)

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

#2B2B2B

Dark Cyan · DarkSlateGray · Dark Stone

HEX
#2B2B2B
RGB
rgb(43, 43, 43)
HSL
hsl(0, 0%, 17%)
HSB
hsb(0, 0%, 17%)
CMYK
cmyk(0%, 0%, 0%, 83%)
Oklch
oklch(28.9% 0.000 89.9)

Traditional「Dark Cyan」· Paint「Dark Stone」· Creative Midnight Shadow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

00C0DC
DB1D00

Analogous

00DB8B
00C0DC
0050DB

Triadic

00C0DC
DB00BE
BEDB00

Split-Comp.

00C0DC
DB0050
DB8B00

Tetradic

00C0DC
8B00DB
DB1D00
50DB00

Contrast Matrix WCAG 2.1 Contrast

00C0DC
008785
9AFF41
6BB32D
2B2B2B
—
2.0
Fail
1.8
Fail
1.2
Fail
6.5
AA
2.0
Fail
—
3.5
AA Large
1.7
Fail
3.2
AA Large
1.8
Fail
3.5
AA Large
—
2.1
Fail
11.3
AAA
1.2
Fail
1.7
Fail
2.1
Fail
—
5.5
AA
6.5
AA
3.2
AA Large
11.3
AAA
5.5
AA
—
White BG
2.2Fail
4.4AA Large
1.3Fail
2.6Fail
14.2AAA
Black BG
9.6AAA
4.8AA
16.8AAA
8.1AAA
1.5Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

5355D5
3A3C85
C6C76F
8A8B4D
2B2B2B

Deuteranopia

483AD4
332986
C0B87A
868155
2B2B2B

Tritanopia

0AD0CF
078686
9F939B
6F676D
2B2B2B

Achromatopsia

8A8A8A
5E5E5E
CBCBCB
8E8E8E
2B2B2B

Shades & Tints Shades & Tints

#00C0DC

Dark
Light

#008785

Dark
Light

#9AFF41

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #00c0dc;
  --color-2: #008785;
  --color-3: #9aff41;
  --color-4: #6bb32d;
  --color-5: #2b2b2b;
}

SCSS

$color-1: #00c0dc;
$color-2: #008785;
$color-3: #9aff41;
$color-4: #6bb32d;
$color-5: #2b2b2b;

TAILWIND

colors: {
  'brand-1': '#00c0dc',
  'brand-2': '#008785',
  'brand-3': '#9aff41',
  'brand-4': '#6bb32d',
  'brand-5': '#2b2b2b',
}

RGB Array

[0, 192, 220], [0, 135, 133], [154, 255, 65], [107, 179, 45], [43, 43, 43]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This summer-style palette of #00C0DC, #008785, #9AFF41, #6BB32D, #2B2B2B 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: #00c0dc; --color-2: #008785; --color-3: #9aff41; --color-4: #6bb32d; --color-5: #2b2b2b. 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 summer-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