Lullaby

Meet Lullaby (#CBD4D4), a soft, muted tone that sits at the intersection of gray, green, and blue. Its quiet complexity gives it a unique character, offering a subtle alternative to standard neutrals without demanding attention, making it a distinctive choice for any designer's palette.

What color is Lullaby?

What is the meaning of Lullaby?

How do I use Lullaby (#CBD4D4) in UI design?

Using Lullaby color codes

Lullaby

#CBD4D4

Access our full UI & UX library today.

What color is Lullaby?

What is the meaning of Lullaby?

How do I use Lullaby (#CBD4D4) in UI design?

Using Lullaby color codes

Lullaby Code Conversions

HEX

#CBD4D4

LAB

84, -3, -1

RGB

203, 212, 212

XYZ

60.1, 64.5, 71.6

HSL

180°, 9%, 81%

LCH

84, 3, 199°

HSB

180°, 4%, 83%

LUV

84, -5, -1

CMYK

4, 0, 0, 17

CMYK

4, 0, 0, 17

HWB

180°, 80%, 17%

Lullaby Color Harmonies

Analogous

Built from colors adjacent on the color wheel, analogous schemes using Lullaby (#CBD4D4) as a base produce a calm and cohesive visual experience.

#CBD4D0

#CBD4D4

#CBD0D4

#CBD4D0

#CBD4D4

#CBD0D4

Complementary

Sitting opposite on the color wheel, complementary colors create maximum visual tension. Paired with Lullaby, they produce a striking, attention-grabbing effect.

#CBD4D4

#D4CBCB

#CBD4D4

#D4CBCB

Split Complementary

A split complementary scheme pairs a base color, like Lullaby, with the two colors flanking its direct opposite for a high-contrast, harmonious look.

#CBD4D4

#D4CBD0

#D4D0CB

#CBD4D4

#D4CBD0

#D4D0CB

Triadic

Triadic schemes select three colors from equidistant points on the color wheel. See how Lullaby works in these bold, yet harmonious, color combinations.

#CBD4D4

#D4CBD4

#D4D4CB

#CBD4D4

#D4CBD4

#D4D4CB

Tetradic

Formed by two complementary color pairs, tetradic schemes create a vibrant, rectangular harmony. See how Lullaby anchors these balanced four-color palettes below.

#CBD4D4

#D0CBD4

#D4CBCB

#D0D4CB

#CBD4D4

#D0CBD4

#D4CBCB

#D0D4CB

Square

The square color scheme places four colors at equal distances on the color wheel. Starting with Lullaby, this method creates a vivid, high-contrast palette.

#CBD4D4

#D0CBD4

#D4CBCB

#D0D4CB

#CBD4D4

#D0CBD4

#D4CBCB

#D0D4CB

Lullaby Contrast Simulation

Text Color

#

Background Color

#

13.91

Super

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.

13.91

Super

Small Text
Pass
Large Text
Pass
Graphic Components
Pass

Lullaby Color Variations

Shades

Shades are darker versions of Lullaby, created by mixing in black to add depth and weight.

#CBD4D4

#AEB6B6

#919797

#747979

#575B5B

#3A3D3D

#1D1E1E

#000000

#CBD4D4

#AEB6B6

#919797

#747979

#575B5B

#3A3D3D

#1D1E1E

#000000

Tints

Tints are lighter variations of Lullaby, made by mixing in white for a softer effect.

#CBD4D4

#D2DADA

#DAE0E0

#E1E6E6

#E9EDED

#F0F3F3

#F8F9F9

#FFFFFF

#CBD4D4

#D2DADA

#DAE0E0

#E1E6E6

#E9EDED

#F0F3F3

#F8F9F9

#FFFFFF

Tones

Tones of Lullaby are created by mixing in gray, producing softer, more subtle hues.

#CBD4D4

#C0C8C8

#B6BCBC

#ABB0B0

#A0A4A4

#959898

#8B8C8C

#808080

#CBD4D4

#C0C8C8

#B6BCBC

#ABB0B0

#A0A4A4

#959898

#8B8C8C

#808080

Hues

Hues are variations of Lullaby, sharing its base color but with different intensities or temperatures.

#CBD4D4

#CBCDD4

#D0CBD4

#D4CBD2

#D4CBCB

#D4D2CB

#D0D4CB

#CBD4CD

#CBD4D4

#CBCDD4

#D0CBD4

#D4CBD2

#D4CBCB

#D4D2CB

#D0D4CB

#CBD4CD

What Interfaces Use Colors Like Lullaby?

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