Blue Color Family

Powder Blue Color Hex Code, RGB & HSL Values

Browse all Blue Colors

What is the meaning of the Powder Blue color?

Powder Blue is a delicate, pale blue color with light gray undertones. It represents soft powdery snow and vintage elegance, used in baby products and clean aesthetic designs.

How to use the Powder Blue color hex code in HTML & CSS?

To style elements with Powder Blue on a website, use the hex code #B0E0E6 in your HTML/CSS. Adding background-color: #B0E0E6; will render the color. In Tailwind CSS, you can apply this shade dynamically using classes like bg-[#B0E0E6] or configuring it as a color variable in your configuration file.

What are the RGB and HSL codes of Powder Blue?

In the digital sRGB spectrum, the Powder Blue color code is mapped to RGB values of Red: 176, Green: 224, and Blue: 230. In the HSL system, it registers at hue angle 187°, saturation 52%, and lightness index 80%. It represents a bright, soft tint characterized by a balanced, moderate saturation.

CMYK print profiles for Powder Blue color

To reproduce the named shade Powder Blue in print systems, the CMYK ink configuration requires 23% Cyan, 3% Magenta, 0% Yellow, and 10% black. These neutral color boundaries serve as solid structural backgrounds, layouts, and typography grids.

Red Channel 176
Green Channel 224
Blue Channel 230
Luminance 0.683

Powder Blue Color Space Conversions

Click to copy format
HEX Color Code #B0E0E6
RGB (Red Green Blue) rgb(176, 224, 230)
HSL (Hue Sat Light) hsl(187°, 52%, 80%)
CMYK (Commercial Print) cmyk(23%, 3%, 0%, 10%)
HSV / HSB Values hsv(187°, 23%, 90%)
Decimal Color Code 11591910
CSS Custom Variable --color-hex: #B0E0E6;
Tailwind CSS Utility bg-[#B0E0E6]
CSS Named Color powderblue

Contrast & Accessibility (WCAG 2.1) Check

White Text on Background

White text readability test with #B0E0E6

Small body copy preview

Black Text on Background

Black text readability test with #B0E0E6

Small body copy preview

Complementary & Analogous Harmonies

Computed dynamically

Shades & Tints Generator Matrix

Copy shade hex values instantly

Darker Shades (Adding Black)

Lighter Tints (Adding White)

{ } CSS Custom Properties (Variables)

Copy CSS Styles
/* CSS Custom Properties for Powder Blue */
--color-hex: #B0E0E6;
--color-rgb: rgb(176, 224, 230);
--color-hsl: hsl(187deg, 52%, 80%);
--color-name: powderblue;

Aa Known Color Aliases

Powder Blue powderblue (CSS Identifier) Soft Powder BluePastel BlueIce Blue

Powder Blue Color Meaning

In design psychology, Powder Blue is classified as a blue shade, inheriting its psychological associations. The blue hue is the most popular color worldwide, chosen by more people across genders and cultures than any other hue. Psychologically, blue creates feelings of trust, reliability, and calm. It lowers blood pressure and heart rate, making it the premier color in healthcare, finance, and technology. Dark blues like navy communicate authority and professionalism, while lighter blues suggest openness and freedom. The sky and ocean — two of humanity's most expansive visual experiences — are blue, giving the color an intrinsic association with infinite depth and possibility. Fortune 500 companies choose blue more than any other color precisely for its trust-building properties.

Emotions & Associations

SerenityReliabilityDepthCalm

Industries

Finance & BankingHealthcareAviation

Adjacent HEX Color Codes

Color Comparisons & Differences

🎨 Cohesive Color Combinations & Palettes

Copied!