#1693A5 + #68B3AC + #53EBFF + #5A9B93 + #376970 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#1693A5

Lake Blue · LightSeaGreen · Mint Ice

HEX

#1693A5

RGB

rgb(22, 147, 165)

HSL

hsl(188, 76%, 37%)

HSB

hsb(188, 87%, 65%)

CMYK

cmyk(87%, 11%, 0%, 35%)

Oklch

oklch(61.0% 0.102 210.5)

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

#68B3AC

Mineral Blue · CadetBlue · Lake Green

HEX

#68B3AC

RGB

rgb(104, 179, 172)

HSL

hsl(174, 33%, 55%)

HSB

hsb(174, 42%, 70%)

CMYK

cmyk(42%, 0%, 4%, 30%)

Oklch

oklch(71.6% 0.076 187.9)

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

#53EBFF

Sky Blue · Turquoise · Lake Green

HEX

#53EBFF

RGB

rgb(83, 235, 255)

HSL

hsl(187, 100%, 66%)

HSB

hsb(187, 67%, 100%)

CMYK

cmyk(67%, 8%, 0%, 0%)

Oklch

oklch(86.8% 0.128 207.6)

Traditional「Sky Blue」· Paint「Lake Green」· Creative Arctic Pool

#5A9B93

Mineral Blue · CadetBlue · Mint Ice

HEX

#5A9B93

RGB

rgb(90, 155, 147)

HSL

hsl(173, 27%, 48%)

HSB

hsb(173, 42%, 61%)

CMYK

cmyk(42%, 0%, 5%, 39%)

Oklch

oklch(64.4% 0.068 185.6)

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

#376970

Slate Blue · DarkSlateGray · Mint Ice

HEX

#376970

RGB

rgb(55, 105, 112)

HSL

hsl(187, 34%, 33%)

HSB

hsb(187, 51%, 44%)

CMYK

cmyk(51%, 6%, 0%, 56%)

Oklch

oklch(48.9% 0.055 207.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

1693A5

A62A17

Analogous

17A671

1693A5

174BA6

Triadic

1693A5

A61793

93A617

Split-Comp.

1693A5

A6174B

A67117

Tetradic

1693A5

7117A6

A62A17

4BA617

Contrast Matrix WCAG 2.1 Contrast

1693A5	68B3AC	53EBFF	5A9B93	376970
—	1.5 Fail	2.6 Fail	1.1 Fail	1.7 Fail
1.5 Fail	—	1.7 Fail	1.3 Fail	2.5 Fail
2.6 Fail	1.7 Fail	—	2.2 Fail	4.3 AA Large
1.1 Fail	1.3 Fail	2.2 Fail	—	1.9 Fail
1.7 Fail	2.5 Fail	4.3 AA Large	1.9 Fail	—

White BG

3.7AA Large

2.4Fail

1.4Fail

3.2AA Large

6.1AA

Black BG

5.8AA

8.6AAA

14.7AAA

6.5AA

3.4AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

4C4DA1

8889AE

9596FA

767795

4D4D6E

Deuteranopia

453CA0

847FAE

8C81F9

726E95

4A466E

Tritanopia

1C9D9C

6CAFAF

5BF6F6

5D9697

3A6D6D

Achromatopsia

707070

9C9C9C

C0C0C0

878787

5B5B5B

Shades & Tints Shades & Tints

#1693A5

Dark

Light

#68B3AC

Dark

Light

#53EBFF

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #1693a5;
  --color-2: #68b3ac;
  --color-3: #53ebff;
  --color-4: #5a9b93;
  --color-5: #376970;
}

SCSS

$color-1: #1693a5;
$color-2: #68b3ac;
$color-3: #53ebff;
$color-4: #5a9b93;
$color-5: #376970;

TAILWIND

colors: {
  'brand-1': '#1693a5',
  'brand-2': '#68b3ac',
  'brand-3': '#53ebff',
  'brand-4': '#5a9b93',
  'brand-5': '#376970',
}

RGB Array

[22, 147, 165], [104, 179, 172], [83, 235, 255], [90, 155, 147], [55, 105, 112]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #1693A5, #68B3AC, #53EBFF, #5A9B93, #376970 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: #1693a5; --color-2: #68b3ac; --color-3: #53ebff; --color-4: #5a9b93; --color-5: #376970. 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 general-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