Celestial Blue

Meet Celestial Blue (#4997D0), a vibrant mid-tone blue with remarkable clarity. Its balanced saturation gives it a clean, digital-native feel, making it a versatile choice for modern interfaces without being overpowering. It's a straightforward, confident hue that commands attention through its purity.

What color is Celestial Blue?

What is the meaning of Celestial Blue?

How do I use Celestial Blue (#4997D0) in UI design?

Using Celestial Blue color codes

Celestial Blue

#4997D0

Access our full UI & UX library today.

What color is Celestial Blue?

What is the meaning of Celestial Blue?

How do I use Celestial Blue (#4997D0) in UI design?

Using Celestial Blue color codes

Celestial Blue Code Conversions

HEX

#4997D0

LAB

60, -6, -36

RGB

73, 151, 208

XYZ

25.2, 28.1, 63.8

HSL

205°, 59%, 55%

LCH

60, 37, 260°

HSB

205°, 65%, 82%

LUV

60, -31, -56

CMYK

65, 27, 0, 18

CMYK

65, 27, 0, 18

HWB

205°, 29%, 18%

Celestial Blue Color Harmonies

Analogous

Sitting next to Celestial Blue on the color wheel, analogous colors create a cohesive and tranquil palette, perfect for serene user interface designs.

#49D0C5

#4997D0

#4954D0

#49D0C5

#4997D0

#4954D0

Complementary

Complementary colors are opposites on the color wheel. When paired with Celestial Blue, its complement will produce the highest possible contrast and visual tension.

#4997D0

#D08249

#4997D0

#D08249

Split Complementary

This scheme pairs Celestial Blue with the two colors flanking its complement, creating a high-contrast look with more sophisticated color harmony.

#4997D0

#D04954

#D0C549

#4997D0

#D04954

#D0C549

Triadic

A triadic scheme pairs Celestial Blue with two other colors equidistant on the color wheel, resulting in a vibrant, high-contrast palette.

#4997D0

#D04997

#97D049

#4997D0

#D04997

#97D049

Tetradic

A tetradic scheme pairs Celestial Blue with three other colors, forming two complementary pairs for a vibrant and balanced four-color palette.

#4997D0

#C549D0

#D08249

#54D049

#4997D0

#C549D0

#D08249

#54D049

Square

Anchored by Celestial Blue, a square scheme adds three more colors, all evenly spaced on the color wheel for a bold, contrasting effect.

#4997D0

#C549D0

#D08249

#54D049

#4997D0

#C549D0

#D08249

#54D049

Celestial Blue Contrast Simulation

Text Color

#

Background Color

#

6.62

Good

Small Text
Pass
Large Text
Pass
Graphic Components
Pass

Your Catchy Large Text Goes Here

A high contrast makes anything easier to read, especially small text.

Text Color

#

Background Color

#

Your Catchy Large Text Goes Here

A high contrast makes anything easier to read, especially small text.

6.62

Good

Small Text
Pass
Large Text
Pass
Graphic Components
Pass

Celestial Blue Color Variations

Shades

Shades of Celestial Blue are created by adding black, which gives the color more depth and weight.

#4997D0

#3F81B2

#346C95

#2A5677

#1F4159

#152B3B

#0A161E

#000000

#4997D0

#3F81B2

#346C95

#2A5677

#1F4159

#152B3B

#0A161E

#000000

Tints

Tints are lighter variations of Celestial Blue, created by adding white for a softer effect.

#4997D0

#63A6D7

#7DB5DD

#97C4E4

#B1D2EB

#CBE1F2

#E5F0F8

#FFFFFF

#4997D0

#63A6D7

#7DB5DD

#97C4E4

#B1D2EB

#CBE1F2

#E5F0F8

#FFFFFF

Tones

Tones of Celestial Blue are created by adding gray, which softens the color’s saturation.

#4997D0

#5194C5

#5990B9

#618DAE

#688AA2

#708797

#78838B

#808080

#4997D0

#5194C5

#5990B9

#618DAE

#688AA2

#708797

#78838B

#808080

Hues

Hues are variations of Celestial Blue, differing in intensity or temperature to create distinct moods.

#4997D0

#6049D0

#C549D0

#D04975

#D08249

#B9D049

#54D049

#49D0A4

#4997D0

#6049D0

#C549D0

#D04975

#D08249

#B9D049

#54D049

#49D0A4

What Interfaces Use Colors Like Celestial Blue?

Never run out of
inspiration again.

Use Mobbin for free as long as you like or get full access
with any of our paid plans.

  • Coinbase

  • Wise

  • Headspace

  • Airbnb

  • Uber

  • Nike

  • Pinterest

  • ChatGPT

  • Shopify

  • Loom

  • Creme

  • Mailchimp

  • Twitch

  • Spotify

  • Apple TV

  • Shop

  • Cosmos

  • Retro

  • Notion

  • Dropbox

Never run out of
inspiration again.

Use Mobbin for free as long as you like or get full access
with any of our paid plans.

  • Coinbase

  • Wise

  • Headspace

  • Airbnb

  • Uber

  • Nike

  • Pinterest

  • ChatGPT

  • Shopify

  • Loom

  • Creme

  • Mailchimp

  • Twitch

  • Spotify

  • Apple TV

  • Shop

  • Cosmos

  • Retro

  • Notion

  • Dropbox

Never run out of
inspiration again.

Use Mobbin for free as long as you like or get full access with any of our paid plans.

  • Coinbase

  • Wise

  • Headspace

  • Airbnb

  • Uber

  • Nike

  • Pinterest

  • ChatGPT

  • Shopify

  • Loom

  • Creme

  • Mailchimp

  • Twitch

  • Spotify

  • Apple TV

  • Shop

  • Cosmos

  • Retro

  • Notion

  • Dropbox