Apricot

Meet Apricot (#FBCEB1), a color that balances gentle warmth with a subtle, luminous quality. Its soft, peachy undertones offer a refreshing alternative to standard neutrals, providing a quiet vibrancy that can illuminate a design palette without overwhelming the composition.

What color is Apricot?

What is the meaning of Apricot?

How do I use Apricot (#FBCEB1) in UI design?

Using Apricot color codes

Apricot

#FBCEB1

Access our full UI & UX library today.

What color is Apricot?

What is the meaning of Apricot?

How do I use Apricot (#FBCEB1) in UI design?

Using Apricot color codes

Apricot Code Conversions

HEX

#FBCEB1

LAB

86, 12, 20

RGB

251, 206, 177

XYZ

69.8, 67.8, 51.0

HSL

24°, 90%, 84%

LCH

86, 24, 60°

HSB

24°, 29%, 98%

LUV

86, 30, 27

CMYK

0, 18, 29, 2

CMYK

0, 18, 29, 2

HWB

24°, 69%, 2%

Apricot Color Harmonies

Analogous

Analogous colors are found next to Apricot on the color wheel. This combination creates a harmonious and serene palette, perfect for a tranquil design.

#FBB1B9

#FBCEB1

#FBF3B1

#FBB1B9

#FBCEB1

#FBF3B1

Complementary

Complementary colors sit directly opposite each other on the color wheel. When paired with Apricot, they create a high-contrast, visually striking combination.

#FBCEB1

#B1DEFB

#FBCEB1

#B1DEFB

Split Complementary

This scheme offers a more nuanced harmony, pairing Apricot with the two colors that sit adjacent to its direct complement on the wheel.

#FBCEB1

#B1FBF3

#B1B9FB

#FBCEB1

#B1FBF3

#B1B9FB

Triadic

A triadic color scheme uses three colors equally spaced on the color wheel. With Apricot, this creates a vibrant yet balanced high-contrast palette.

#FBCEB1

#B1FBCE

#CEB1FB

#FBCEB1

#B1FBCE

#CEB1FB

Tetradic

Tetradic color schemes use two pairs of complementary colors. For Apricot, this creates a bold palette with maximum color variation and built-in harmony.

#FBCEB1

#B9FBB1

#B1DEFB

#F3B1FB

#FBCEB1

#B9FBB1

#B1DEFB

#F3B1FB

Square

A square color scheme uses four colors equidistant on the color wheel. With Apricot as the base, this creates a vibrant, high-contrast palette.

#FBCEB1

#B9FBB1

#B1DEFB

#F3B1FB

#FBCEB1

#B9FBB1

#B1DEFB

#F3B1FB

Apricot Contrast Simulation

Text Color

#

Background Color

#

14.57

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.

14.57

Super

Small Text
Pass
Large Text
Pass
Graphic Components
Pass

Apricot Color Variations

Shades

Shades of Apricot are created by adding black, resulting in darker tones with more weight.

#FBCEB1

#D7B198

#B3937E

#8F7665

#6C584C

#483B33

#241D19

#000000

#FBCEB1

#D7B198

#B3937E

#8F7665

#6C584C

#483B33

#241D19

#000000

Tints

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

#FBCEB1

#FCD5BC

#FCDCC7

#FDE3D2

#FDEADE

#FEF1E9

#FEF8F4

#FFFFFF

#FBCEB1

#FCD5BC

#FCDCC7

#FDE3D2

#FDEADE

#FEF1E9

#FEF8F4

#FFFFFF

Tones

Tones of Apricot are created by adding gray, which mutes the color for a softer effect.

#FBCEB1

#E9C3AA

#D8B8A3

#C6AD9C

#B5A195

#A3968E

#928B87

#808080

#FBCEB1

#E9C3AA

#D8B8A3

#C6AD9C

#B5A195

#A3968E

#928B87

#808080

Hues

Hues are variations of Apricot, sharing its base but differing in intensity and temperature.

#FBCEB1

#F0FBB1

#B9FBB1

#B1FBE1

#B1DEFB

#BBB1FB

#F3B1FB

#FBB1CB

#FBCEB1

#F0FBB1

#B9FBB1

#B1FBE1

#B1DEFB

#BBB1FB

#F3B1FB

#FBB1CB

What Interfaces Use Colors Like Apricot?

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