Powder Blue color guide
HEX
#B0E0E6
RGB
176, 224, 230
HSL
187°, 52%, 80%
HSV
187°, 23%, 90%
Dusty and slightly grayed, powder blue evokes talc, ballet slippers, and vintage sportswear piping. #B0E0E6 keeps a muted quality that prevents it from scanning as neon screen blue. It pairs elegantly with creams and warm metallics.
Best for
Educational platforms, course materials, and infographic designs.
Compare with
Accessibility
Check contrast before using powder blue for text-heavy layouts, especially on low-contrast backgrounds.
How does powder blue compare to nearby colors?
What is the difference between powder blue and sky blue?
The visible difference between Powder Blue (#B0E0E6) and Sky Blue (#87CEEB) is subtle, but it still nudges the family from working chroma toward bright chroma. Powder Blue is the one you reach for when the palette needs lightness and breathing room rather than a firmer visual frame. Start with powder blue when the palette wants more working chroma; switch to sky blue when the better fit is bright chroma.
What color is powder blue?
Common in vintage fashion terminology, interior paint collections, and soft editorial layouts. The name suggests a dry, matte finish rather than glossy plastic.
What is the hex code for powder blue?
| Format | Value |
|---|---|
| HEX | #B0E0E6 |
| RGB | rgb(176, 224, 230) |
| HSL | hsl(187°, 52%, 80%) |
| HSV / HSB | hsv(187°, 23%, 90%) |
| CMYK (approx.) | cmyk(23%, 3%, 0%, 10%) |
Convert Powder Blue to other color formats
Open the color converter with Powder Blue (#B0E0E6) prefilled to copy RGB, HSL, HSV, CMYK, or OKLCH values.
Convert Powder Blue in the color converter →What does powder blue mean in design?
Powder blue is often associated with nostalgia, delicacy, and understated elegance. Next to periwinkle or baby blue, it tends to read as chalkier and less sugary or lavender-leaning.
How do I use powder blue in code?
| CSS (hex) | color: #B0E0E6; |
| CSS (rgb) | color: rgb(176, 224, 230); |
| CSS (hsl) | color: hsl(187, 52%, 80%); |
| RGB % | rgb(69%, 88%, 90%) |
| Tailwind | text-[#B0E0E6] |
| SwiftUI | Color(red: 0.690, green: 0.878, blue: 0.902) |
| UIKit | UIColor(red: 0.690, green: 0.878, blue: 0.902, alpha: 1.0) |
| Android | Color.rgb(176, 224, 230) |
| Compose | Color(0xFFB0E0E6) |
| Web Safe | #99CCFF |
Is powder blue accessible?
| Combination | Ratio | AA | AA lg | AAA | AAA lg | UI |
|---|---|---|---|---|---|---|
| AaWhite text on this color | 1.43:1 | ✗ | ✗ | ✗ | ✗ | ✗ |
| AaBlack text on this color | 14.65:1 | ✓ | ✓ | ✓ | ✓ | ✓ |
| AaThis color as text on white | 1.43:1 | ✗ | ✗ | ✗ | ✗ | ✗ |
| AaThis color as text on black | 14.65:1 | ✓ | ✓ | ✓ | ✓ | ✓ |
WCAG 2.1: AA normal ≥ 4.5:1, AA large text ≥ 3:1, AAA normal ≥ 7:1, AAA large ≥ 4.5:1, UI components ≥ 3:1.
How does powder blue look with color blindness?
Simulated appearance for common types of color vision deficiency. Actual perception varies by individual.
What colors go with powder blue
With powder blue on broader surfaces, charcoal adds enough depth to keep the system legible without the harsher edge of pure black.
Gold warms powder blue enough to keep the palette from feeling chilly or overly technical, while still reading intentional rather than decorative-for-its-own-sake.
Cream helps powder blue read warmer, softer, and less screen-hard than it would beside pure white.
What colors clash with powder blue
Neon Green beside powder blue tends to vibrate on bright displays, so the pair reads more like a HUD effect than a considered brand palette.
Magenta remaps powder blue too aggressively, dragging it away from healthcare, airy product surfaces, and calm interfaces and into a brighter, more performative palette.
Orange changes the context around powder blue so quickly that the palette can start looking campaign-specific rather than durable.
Light Gray sits too close to powder blue in value, so the palette can wash out before it ever establishes a clear hierarchy.
How should I use powder blue in design?
- •Use powder blue for soft backgrounds and supporting surfaces rather than foreground text — it creates a gentle atmosphere while keeping the layout open and readable.
- •Warm touches like gold or coral bring out powder blue's cooler character by contrast, while staying with cool neighbors creates a calmer, more unified feel.
- •Powder Blue's lightness makes it a good candidate for email backgrounds, slide canvases, and page sections where you want atmosphere, not distraction.
What are good powder blue palettes?
Daylight
Educational platforms, course materials, and infographic designs.
Design with powder blue in Moda
Create a presentation or document using powder blue as your accent color. Moda's AI applies your color palette automatically.
Create a design with powder blue →What are the shades and tints of powder blue?
Shades (darker)
Tints (lighter)
Tones (desaturated)
Hue variations
What are the color harmonies for powder blue?
Harmonies are calculated from the base swatch. When a harmony matches a named color page, it links there; otherwise it appears here as a computed reference swatch.
Similar colors
Light Blue
Light Blue sits close to powder blue in hue, but its aqua-blue cast changes the mood of the palette even when the contrast shift is small.
Sky Blue
Sky Blue is almost the same hue as powder blue; the real difference is value, with sky blue feeling more grounded and anchor-ready.
Baby Blue
Baby Blue stays very close to powder blue in hue, but it lands darker, which makes it better for headlines, anchors, and darker sections than for lighter surfaces and more open applications.
Ice Blue
Ice Blue is almost the same hue as powder blue; the real difference is value, with ice blue feeling more grounded and anchor-ready.
Electric Blue
Electric Blue is nearly adjacent to powder blue in hue; what separates them is intensity, with electric blue reading cleaner and more assertive.
Frequently asked questions
What is the hex code for powder blue?
The hex code for powder blue is #B0E0E6. In RGB, that's 176 red, 224 green, and 230 blue. The approximate CMYK equivalent is 23% cyan, 3% magenta, 0% yellow, and 10% key (black).
Is powder blue a warm or cool color?
Powder Blue reads as cool. It settles naturally beside blues, greens, silver, and charcoal, and feels more animated when paired with warm accents like gold, coral, or rust.
Where does powder blue work best in a layout?
Powder Blue is flexible enough to move between accents, section blocks, and supporting roles depending on the contrast around it. It works best when the rest of the palette gives it a clear job instead of asking it to do everything at once.
How should I use powder blue in a design?
Powder Blue works as a soft background or supporting color for slide canvases, section panels, and marketing surfaces. Use dark text for readability and reserve stronger accents for buttons, charts, and key takeaways.
Can I use powder blue for text or backgrounds?
Powder Blue works better with dark text than white text. Black text reaches 14.65:1 contrast on the swatch, which makes the color more usable as a background or highlight surface than as a dark panel.
More blue colors
Keep exploring color resources
All color pages
Browse the full library of color references, pairings, and palettes.
Blue colors
Compare powder blue with other blue tones.
Green colors
Explore nearby color families to build stronger palettes and contrasts.
Neutral colors
Explore nearby color families to build stronger palettes and contrasts.
Purple colors
Explore nearby color families to build stronger palettes and contrasts.
Last updated April 6, 2026
Color values are computed from the listed hex code using standard conversion formulas. RGB, HSL, and HSV are exact screen-ready conversions. CMYK is an approximate on-screen reference, not a press-ready print specification. Pairings, palettes, and use-case guidance are heuristic recommendations derived from color relationships, contrast behavior, and common presentation, document, and UI patterns.