Yale Blue

Discover Yale Blue, #0F4D92, a color defined by its profound depth and clarity. This specific shade of blue stands out for its authoritative yet approachable presence, making it a compelling choice for designers seeking a strong, reliable anchor in their visual systems.

What color is Yale Blue?

What is the meaning of Yale Blue?

How do I use Yale Blue (#0F4D92) in UI design?

Using Yale Blue color codes

Yale Blue

#0F4D92

Access our full UI & UX library today.

What color is Yale Blue?

What is the meaning of Yale Blue?

How do I use Yale Blue (#0F4D92) in UI design?

Using Yale Blue color codes

Yale Blue Code Conversions

HEX

#0F4D92

LAB

33, 9, -43

RGB

15, 77, 146

XYZ

8.0, 7.5, 28.2

HSL

212°, 81%, 32%

LCH

33, 44, 281°

HSB

212°, 90%, 57%

LUV

33, -18, -60

CMYK

90, 47, 0, 43

CMYK

90, 47, 0, 43

HWB

212°, 6%, 43%

Yale Blue Color Harmonies

Analogous

Sitting beside Yale Blue on the color wheel, analogous colors produce a cohesive and serene look, perfect for creating a sense of visual unity.

#0F8F92

#0F4D92

#120F92

#0F8F92

#0F4D92

#120F92

Complementary

Complementary colors sit directly opposite each other on the color wheel. Paired with Yale Blue, its complement creates a striking, high-contrast visual effect.

#0F4D92

#92540F

#0F4D92

#92540F

Split Complementary

A split complementary scheme for Yale Blue uses the two colors adjacent to its direct complement, offering a vibrant yet balanced palette.

#0F4D92

#92120F

#8F920F

#0F4D92

#92120F

#8F920F

Triadic

Triadic color schemes use three hues equally spaced on the color wheel. With Yale Blue, this creates a vibrant, high-contrast, and balanced palette.

#0F4D92

#920F4D

#4D920F

#0F4D92

#920F4D

#4D920F

Tetradic

A tetradic palette for Yale Blue is built from two pairs of complementary colors, forming a rectangle on the color wheel for a versatile combination.

#0F4D92

#920F8F

#92540F

#0F9212

#0F4D92

#920F8F

#92540F

#0F9212

Square

A square color scheme pairs Yale Blue with three other colors, all equidistant on the color wheel, creating a vibrant and high-contrast palette.

#0F4D92

#920F8F

#92540F

#0F9212

#0F4D92

#920F8F

#92540F

#0F9212

Yale Blue Contrast Simulation

Text Color

#

Background Color

#

8.41

Excellent

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.

8.41

Excellent

Small Text
Pass
Large Text
Pass
Graphic Components
Pass

Yale Blue Color Variations

Shades

Adding black to Yale Blue creates darker shades, which give designs more depth and weight.

#0F4D92

#0D427D

#0B3768

#092C53

#06213F

#04162A

#020B15

#000000

#0F4D92

#0D427D

#0B3768

#092C53

#06213F

#04162A

#020B15

#000000

Tints

Tints are lighter versions of Yale Blue, created by adding white for a softer effect.

#0F4D92

#3166A2

#5480B1

#7699C1

#98B3D0

#BACCE0

#DDE6EF

#FFFFFF

#0F4D92

#3166A2

#5480B1

#7699C1

#98B3D0

#BACCE0

#DDE6EF

#FFFFFF

Tones

Tones of Yale Blue are created by adding gray, resulting in softer, desaturated variations.

#0F4D92

#1F548F

#2F5C8D

#3F638A

#506A88

#607185

#707983

#808080

#0F4D92

#1F548F

#2F5C8D

#3F638A

#506A88

#607185

#707983

#808080

Hues

Hues are Yale Blue variations differing in intensity or temperature, subtly altering a design’s mood.

#0F4D92

#330F92

#920F8F

#920F2C

#92540F

#6E920F

#0F9212

#0F9275

#0F4D92

#330F92

#920F8F

#920F2C

#92540F

#6E920F

#0F9212

#0F9275

What Interfaces Use Colors Like Yale 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