Cardinal

Meet Cardinal, #C41E3A. This deep, saturated red commands attention without being overwhelming. Its richness offers a powerful alternative to primary red, sitting at a unique intersection of intensity and sophistication, making it a compelling choice for any designer's palette.

What color is Cardinal?

What is the meaning of Cardinal?

How do I use Cardinal (#C41E3A) in UI design?

Using Cardinal color codes

Cardinal

#C41E3A

Access our full UI & UX library today.

What color is Cardinal?

What is the meaning of Cardinal?

How do I use Cardinal (#C41E3A) in UI design?

Using Cardinal color codes

Cardinal Code Conversions

HEX

#C41E3A

LAB

43, 63, 28

RGB

196, 30, 58

XYZ

24.0, 13.0, 5.2

HSL

350°, 73%, 44%

LCH

43, 69, 24°

HSB

350°, 85%, 77%

LUV

43, 118, 17

CMYK

0, 85, 70, 23

CMYK

0, 85, 70, 23

HWB

350°, 12%, 23%

Cardinal Color Harmonies

Analogous

Built from colors adjacent to Cardinal on the color wheel, analogous palettes offer a sense of harmony and tranquility for a cohesive design.

#C41E8D

#C41E3A

#C4551E

#C41E8D

#C41E3A

#C4551E

Complementary

To find Cardinal's complement, look directly opposite it on the color wheel. This pairing produces a vibrant combination with maximum visual contrast.

#C41E3A

#1EC4A8

#C41E3A

#1EC4A8

Split Complementary

Split complementary palettes for Cardinal pair it with the two colors bordering its complement, providing strong visual contrast with more nuance.

#C41E3A

#1EC455

#1E8DC4

#C41E3A

#1EC455

#1E8DC4

Triadic

A triadic scheme pairs Cardinal with two other colors, each equidistant on the color wheel, creating a vibrant and balanced high-contrast palette.

#C41E3A

#3AC41E

#1E3AC4

#C41E3A

#3AC41E

#1E3AC4

Tetradic

A tetradic color scheme uses four colors, forming two complementary pairs. Here, Cardinal is paired with its complement, alongside another complementary duo.

#C41E3A

#8DC41E

#1EC4A8

#551EC4

#C41E3A

#8DC41E

#1EC4A8

#551EC4

Square

The square color scheme builds on Cardinal by selecting three additional colors, each ninety degrees apart, resulting in a vivid and striking visual effect.

#C41E3A

#8DC41E

#1EC4A8

#551EC4

#C41E3A

#8DC41E

#1EC4A8

#551EC4

Cardinal Contrast Simulation

Text Color

#

Background Color

#

5.84

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.

5.84

Good

Small Text
Pass
Large Text
Pass
Graphic Components
Pass

Cardinal Color Variations

Shades

Shades are darker versions of Cardinal made by adding black, which introduces depth and weight.

#C41E3A

#A81A32

#8C1529

#701121

#540D19

#380911

#1C0408

#000000

#C41E3A

#A81A32

#8C1529

#701121

#540D19

#380911

#1C0408

#000000

Tints

Tints are lighter variations of Cardinal, created by adding white for a softer feel.

#C41E3A

#CC3E56

#D55E72

#DD7E8E

#E69FAB

#EEBFC7

#F7DFE3

#FFFFFF

#C41E3A

#CC3E56

#D55E72

#DD7E8E

#E69FAB

#EEBFC7

#F7DFE3

#FFFFFF

Tones

Tones are muted versions of Cardinal, created by adding gray to soften its saturation.

#C41E3A

#BA2C44

#B13A4E

#A74858

#9D5662

#93646C

#8A7276

#808080

#C41E3A

#BA2C44

#B13A4E

#A74858

#9D5662

#93646C

#8A7276

#808080

Hues

Hues are variations of Cardinal that share its base color but differ in intensity or temperature.

#C41E3A

#C47E1E

#8DC41E

#1EC42B

#1EC4A8

#1E64C4

#551EC4

#C41EB7

#C41E3A

#C47E1E

#8DC41E

#1EC42B

#1EC4A8

#1E64C4

#551EC4

#C41EB7

What Interfaces Use Colors Like Cardinal?

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