Blue Bell

Meet Blue Bell (#403CA8), a deep and saturated blue with a noticeable violet undertone. Its electric quality gives it a striking presence, commanding attention without being overwhelming. This particular hue possesses a unique vibrancy that sets it apart from more common blues.

What color is Blue Bell?

What is the meaning of Blue Bell?

How do I use Blue Bell (#403CA8) in UI design?

Using Blue Bell color codes

Blue Bell

#403CA8

Access our full UI & UX library today.

What color is Blue Bell?

What is the meaning of Blue Bell?

How do I use Blue Bell (#403CA8) in UI design?

Using Blue Bell color codes

Blue Bell Code Conversions

HEX

#403CA8

LAB

32, 35, -58

RGB

64, 60, 168

XYZ

10.8, 7.1, 37.8

HSL

242°, 47%, 45%

LCH

32, 67, 301°

HSB

242°, 64%, 66%

LUV

32, -5, -80

CMYK

62, 64, 0, 34

CMYK

62, 64, 0, 34

HWB

242°, 24%, 34%

Blue Bell Color Harmonies

Analogous

Analogous colors are neighbors on the color wheel. For Blue Bell, this creates a harmonious and serene palette, blending smoothly from one shade to another.

#3C6EA8

#403CA8

#763CA8

#3C6EA8

#403CA8

#763CA8

Complementary

Found on the opposite side of the color wheel, complementary colors create a vibrant, high-contrast effect when paired with Blue Bell.

#403CA8

#A4A83C

#403CA8

#A4A83C

Split Complementary

A split complementary scheme for Blue Bell pairs it with the two colors adjacent to its direct complement, offering a vibrant yet balanced palette.

#403CA8

#A8763C

#6EA83C

#403CA8

#A8763C

#6EA83C

Triadic

A triadic scheme pairs Blue Bell with two other colors, all equally spaced on the color wheel, creating a bold and balanced palette.

#403CA8

#A8403C

#3CA840

#403CA8

#A8403C

#3CA840

Tetradic

A tetradic color scheme for Blue Bell uses two pairs of complementary colors, forming a rich and balanced four-color palette for your designs.

#403CA8

#A83C6E

#A4A83C

#3CA876

#403CA8

#A83C6E

#A4A83C

#3CA876

Square

The square color scheme features four hues equidistant on the color wheel. Starting with Blue Bell, this combination offers a balanced yet highly contrasting look.

#403CA8

#A83C6E

#A4A83C

#3CA876

#403CA8

#A83C6E

#A4A83C

#3CA876

Blue Bell Contrast Simulation

Text Color

#

Background Color

#

8.64

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.64

Excellent

Small Text
Pass
Large Text
Pass
Graphic Components
Pass

Blue Bell Color Variations

Shades

Adding black to Blue Bell creates darker shades, giving your design more depth and weight.

#403CA8

#373390

#2E2B78

#252260

#1B1A48

#121130

#090918

#000000

#403CA8

#373390

#2E2B78

#252260

#1B1A48

#121130

#090918

#000000

Tints

Tints are created by adding white to Blue Bell, which produces lighter, softer variations.

#403CA8

#5B58B4

#7774C1

#9290CD

#ADABDA

#C8C7E6

#E4E3F3

#FFFFFF

#403CA8

#5B58B4

#7774C1

#9290CD

#ADABDA

#C8C7E6

#E4E3F3

#FFFFFF

Tones

Tones of Blue Bell are created by adding gray, resulting in softer, less saturated versions.

#403CA8

#4946A2

#524F9D

#5B5997

#656391

#6E6D8B

#777686

#808080

#403CA8

#4946A2

#524F9D

#5B5997

#656391

#6E6D8B

#777686

#808080

Hues

Hues are variations of Blue Bell (#403CA8) that differ in intensity or temperature, creating different moods.

#403CA8

#913CA8

#A83C6E

#A85B3C

#A4A83C

#53A83C

#3CA876

#3C89A8

#403CA8

#913CA8

#A83C6E

#A85B3C

#A4A83C

#53A83C

#3CA876

#3C89A8

What Interfaces Use Colors Like Blue Bell?

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