Crimson

Meet Crimson (#DC143C), a powerful red that commands attention. Its deep, saturated character gives it a distinct visual weight, sitting confidently between a pure red and a rich magenta. This intensity makes it a memorable choice for any design palette.

What color is Crimson?

What is the meaning of Crimson?

How do I use Crimson (#DC143C) in UI design?

Using Crimson color codes

Crimson

#DC143C

Access our full UI & UX library today.

What color is Crimson?

What is the meaning of Crimson?

How do I use Crimson (#DC143C) in UI design?

Using Crimson color codes

Crimson Code Conversions

HEX

#DC143C

LAB

47, 71, 34

RGB

220, 20, 60

XYZ

30.6, 16.0, 5.8

HSL

348°, 83%, 47%

LCH

47, 78, 25°

HSB

348°, 91%, 86%

LUV

47, 138, 20

CMYK

0, 91, 73, 14

CMYK

0, 91, 73, 14

HWB

348°, 8%, 14%

Crimson Color Harmonies

Analogous

Analogous colors sit next to each other on the color wheel. When paired with Crimson, they form a rich, yet tranquil, color scheme.

#DC14A0

#DC143C

#DC5014

#DC14A0

#DC143C

#DC5014

Complementary

Complementary colors sit opposite each other on the color wheel. When paired with Crimson, its complement creates a striking, high-contrast visual effect.

#DC143C

#14DCB4

#DC143C

#14DCB4

Split Complementary

A split complementary scheme pairs Crimson with the two colors adjacent to its direct complement, creating a high-contrast palette with more nuance.

#DC143C

#14DC50

#14A0DC

#DC143C

#14DC50

#14A0DC

Triadic

A triadic color scheme for Crimson involves selecting two other colors equally spaced on the color wheel, creating a vibrant and balanced high-contrast palette.

#DC143C

#3CDC14

#143CDC

#DC143C

#3CDC14

#143CDC

Tetradic

A tetradic color scheme for Crimson involves two pairs of complementary colors, forming a rectangle on the color wheel for a vibrant, balanced palette.

#DC143C

#A0DC14

#14DCB4

#5014DC

#DC143C

#A0DC14

#14DCB4

#5014DC

Square

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

#DC143C

#A0DC14

#14DCB4

#5014DC

#DC143C

#A0DC14

#14DCB4

#5014DC

Crimson Contrast Simulation

Text Color

#

Background Color

#

4.99

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.

4.99

Good

Small Text
Pass
Large Text
Pass
Graphic Components
Pass

Crimson Color Variations

Shades

Shades of Crimson are created by adding black, resulting in darker, weightier tones.

#DC143C

#BD1133

#9D0E2B

#7E0B22

#5E091A

#3F0611

#1F0309

#000000

#DC143C

#BD1133

#9D0E2B

#7E0B22

#5E091A

#3F0611

#1F0309

#000000

Tints

Mixing white with Crimson creates tints, which are lighter variations that soften the original hue.

#DC143C

#E13658

#E65774

#EB7990

#F09AAB

#F5BCC7

#FADDE3

#FFFFFF

#DC143C

#E13658

#E65774

#EB7990

#F09AAB

#F5BCC7

#FADDE3

#FFFFFF

Tones

Adding gray to Crimson creates tones, resulting in a softer, more muted appearance.

#DC143C

#CF2346

#C2334F

#B54259

#A75263

#9A616D

#8D7176

#808080

#DC143C

#CF2346

#C2334F

#B54259

#A75263

#9A616D

#8D7176

#808080

Hues

Hues are variations of Crimson, with changes in intensity or temperature affecting visual tone.

#DC143C

#DC8214

#A0DC14

#14DC1E

#14DCB4

#146EDC

#5014DC

#DC14D2

#DC143C

#DC8214

#A0DC14

#14DC1E

#14DCB4

#146EDC

#5014DC

#DC14D2

What Interfaces Use Colors Like Crimson?

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