What is the RGB and CMYK value of Ice Blue for CSS and print?

For CSS and web development, the RGB value is rgb(175, 219, 245). For four-color print processes, the CMYK formulation is cmyk(29%, 11%, 0%, 4%).

Is Ice Blue WCAG 2.1 contrast accessible for web text?

Against pure white (#FFFFFF), Ice Blue achieves a contrast ratio of 1.47:1 (Fail). Against pure black (#000000), it achieves 14.28:1 (AAA).

Crisp Frosted Glacial Sky Pastel Category: Blue

Ice Blue (#AFDBF5) — Color Codes, Meaning & UI Palettes

Q: What is the exact HEX code for Ice Blue?

The exact HEX code for Ice Blue is #AFDBF5. In 8-digit hex with 100% opacity, it is #AFDBF5FF. In RGB, it is rgb(175, 219, 245), and in HSL it is hsl(202deg, 78%, 82%).

Q: What colors go well with Ice Blue in UI design?

Ice Blue (#AFDBF5) pairs best with Deep Arctic Navy (#0B132B), Pure White (#FFFFFF), Slate Silver (#94A3B8), and Coral Warmth (#FB7185).

Ice Blue (#AFDBF5) is a crystalline, high-lightness tint of sky blue infused with glacial frost. It evokes clean mountain air, pure meltwater, winter serenity, and futuristic precision.

Quick Answer (Ice Blue Color Code): The exact HEX code for Ice Blue is #AFDBF5. In RGB, it is rgb(175, 219, 245). In HSL, it is hsl(202deg, 78%, 82%), and its print CMYK formulation is cmyk(29%, 11%, 0%, 4%). It has a relative luminance of 0.664 and pairs best in UI design with Deep Arctic Navy (#0B132B) and Pure White (#FFFFFF).

Click to Copy HEX

Ice Blue

#AFDBF5

Open in Color Wheel Generate 11 Scales Add Opacity (RGBA) Edit in Studio

HEX

#AFDBF5

RGB

rgb(175, 219, 245)

HSL

hsl(202deg, 78%, 82%)

CMYK (Print)

cmyk(29%, 11%, 0%, 4%)

Apple Display P3

color(display-p3 0.686 0.859 0.961)

WCAG 2.1 Accessibility & Contrast Rating

White Text (#FFFFFF) 1.47:1 (Fail)

Black Text (#000000) 14.28:1 (AAA)

11-Step Tints & Shades Scale (Tailwind 50–950)

Mathematically balanced luminance scale for design tokens and CSS color palettes. Click any shade to copy hex code:

#EDF7FD

100

#DBEFFB

200

#B6DFF6

300

#89CAF0

400

#53B2EA

500

#AFDBF5

600

#6ABDED

700

#2BA1E5

800

#1679B3

900

#0F5177

950

#082D43

Color Harmonies & Palette Schemes

Complementary

#F5C8AD

Opposite 180° Contrast

Analogous -30°

#ADF5EB

Natural Harmony

Analogous +30°

#ADB7F5

Natural Harmony

Triadic +120°

#F5ADDB

120° Balanced Triad

Triadic +240°

#DBF5AD

120° Balanced Triad

Curated UI Design Pairings for Ice Blue

Calming surface backdrop, status indicator, and interactive card tint for cold-plunge wellness apps, cryotherapy clinics, and clean cloud tech.

Deep Arctic Navy

#0B132B

Authoritative Contrast Text

Pure White

#FFFFFF

Pristine Snow Canvas

Slate Silver

#94A3B8

Cool Muted Border

Coral Warmth

#FB7185

Dynamic High-Contrast Pop

Export Ice Blue Code Snippets

CSS Variable --color-ice-blue: #AFDBF5;

Tailwind Config 'ice-blue': '#AFDBF5'

Swift / SwiftUI Color(hex: "#AFDBF5")

JSON Design Token {"name": "Ice Blue", "hex": "#AFDBF5"}

Frequently Asked Questions About Ice Blue (#AFDBF5)

What is the exact HEX code for Ice Blue?

The exact HEX code for Ice Blue is #AFDBF5. In 8-digit hexadecimal (with 100% opacity), it is #AFDBF5FF. Its RGB decimal equivalent is rgb(175, 219, 245) and its HSL value is hsl(202deg, 78%, 82%).

What colors go best with Ice Blue in UI and web design?

Ice Blue pairs exceptionally well with Deep Arctic Navy (#0B132B), Pure White (#FFFFFF), Slate Silver (#94A3B8), and Coral Warmth (#FB7185).

How do I use Ice Blue in CSS and Tailwind CSS?

In standard CSS, apply it directly via color: #AFDBF5; or background-color: #AFDBF5;. In Tailwind CSS, use arbitrary value syntax like bg-[#afdbf5] or text-[#afdbf5], or define it in your Tailwind v4 @theme block as --color-ice-blue: #AFDBF5;.

Is Ice Blue WCAG accessible for readable text?

Against a pure white background (#FFFFFF), Ice Blue achieves a contrast ratio of 1.47:1 (Fail). Against a pure black background (#000000), it achieves 14.28:1 (AAA). Check custom contrast pairings on Pikka's WCAG Contrast Checker.

Explore More Colors in the Dictionary

Browse our complete catalog of curated named colors, harmonic palettes, and accessible UI combinations.

Named Color Dictionary Interactive Color Wheel Tint & Shade Generator