← Back to Editor

#738CA0 · #98AAB6 · #ADBAC0 · #CED3D6 · #F0CEDF

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#738CA0

Slate Blue · LightSlateGray · Navy Blue

HEX
#738CA0
RGB
rgb(115, 140, 160)
HSL
hsl(207, 19%, 54%)
HSB
hsb(207, 28%, 63%)
CMYK
cmyk(28%, 12%, 0%, 37%)
Oklch
oklch(62.8% 0.042 242.5)

Traditional「Slate Blue」· Paint「Navy Blue」· Creative Blush Sunrise

#98AAB6

Sky Blue · DarkGray · Cobalt Blue

HEX
#98AAB6
RGB
rgb(152, 170, 182)
HSL
hsl(204, 17%, 65%)
HSB
hsb(204, 16%, 71%)
CMYK
cmyk(16%, 7%, 0%, 29%)
Oklch
oklch(72.8% 0.027 237.0)

Traditional「Sky Blue」· Paint「Cobalt Blue」· Creative Twilight Haze

#ADBAC0

Sky Blue · Silver · Lake Green

HEX
#ADBAC0
RGB
rgb(173, 186, 192)
HSL
hsl(199, 13%, 72%)
HSB
hsb(199, 10%, 75%)
CMYK
cmyk(10%, 3%, 0%, 25%)
Oklch
oklch(78.1% 0.017 227.0)

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

#CED3D6

Sky Blue · LightGray · Pearl Gray

HEX
#CED3D6
RGB
rgb(206, 211, 214)
HSL
hsl(203, 9%, 82%)
HSB
hsb(203, 4%, 84%)
CMYK
cmyk(4%, 1%, 0%, 16%)
Oklch
oklch(86.4% 0.007 233.7)

Traditional「Sky Blue」· Paint「Pearl Gray」· Creative Silver Lining

#F0CEDF

Rouge · Pink · Cherry Blossom

HEX
#F0CEDF
RGB
rgb(240, 206, 223)
HSL
hsl(330, 53%, 87%)
HSB
hsb(330, 14%, 94%)
CMYK
cmyk(0%, 14%, 7%, 6%)
Oklch
oklch(88.5% 0.044 346.4)

Traditional「Rouge」· Paint「Cherry Blossom」· Creative Rose Petal

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

738CA0
A08773

Analogous

73A09E
738CA0
7376A0

Triadic

738CA0
A0738C
8CA073

Split-Comp.

738CA0
A07376
A09E73

Tetradic

738CA0
9E73A0
A08773
76A073

Contrast Matrix WCAG 2.1 Contrast

738CA0
98AAB6
ADBAC0
CED3D6
F0CEDF
—
1.5
Fail
1.8
Fail
2.3
Fail
2.4
Fail
1.5
Fail
—
1.2
Fail
1.6
Fail
1.7
Fail
1.8
Fail
1.2
Fail
—
1.3
Fail
1.4
Fail
2.3
Fail
1.6
Fail
1.3
Fail
—
1.0
Fail
2.4
Fail
1.7
Fail
1.4
Fail
1.0
Fail
—
White BG
3.5AA Large
2.4Fail
2.0Fail
1.5Fail
1.4Fail
Black BG
6.0AA
8.8AAA
10.6AAA
13.9AAA
14.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

7E7E9B
A0A0B3
B3B3BF
D0D0D5
E1E1DB

Deuteranopia

7C7B9A
9F9DB2
B2B1BE
D0D0D5
E3E6DA

Tritanopia

749797
99B1B0
AEBDBD
CED5D5
EED8D7

Achromatopsia

878787
A6A6A6
B7B7B7
D2D2D2
DADADA

Shades & Tints Shades & Tints

#738CA0

Dark
Light

#98AAB6

Dark
Light

#ADBAC0

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #738ca0;
  --color-2: #98aab6;
  --color-3: #adbac0;
  --color-4: #ced3d6;
  --color-5: #f0cedf;
}

SCSS

$color-1: #738ca0;
$color-2: #98aab6;
$color-3: #adbac0;
$color-4: #ced3d6;
$color-5: #f0cedf;

TAILWIND

colors: {
  'brand-1': '#738ca0',
  'brand-2': '#98aab6',
  'brand-3': '#adbac0',
  'brand-4': '#ced3d6',
  'brand-5': '#f0cedf',
}

RGB Array

[115, 140, 160], [152, 170, 182], [173, 186, 192], [206, 211, 214], [240, 206, 223]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #738CA0, #98AAB6, #ADBAC0, #CED3D6, #F0CEDF is ideal for: brand design, premium product pages, magazine layouts, health products, baby brands, fresh-style blogs. Low-saturation colors convey a sophisticated, premium feel. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #738ca0; --color-2: #98aab6; --color-3: #adbac0; --color-4: #ced3d6; --color-5: #f0cedf. 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?

Light tones suit backgrounds; use dark colors for body text. Mid-tones work for card backgrounds or dividers to add depth. 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 beauty, lifestyle, arts industries. Restrained colors convey professionalism and trust. 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