Material Pink 100

Preview

Material Pink 100

#f8bbd0

Overview

Family: Red

material

Accessibility on this swatch:

AAA

(13.01:1)

Contrast vs white: 1.61:1 · vs black: 13.01:1

Formats

HEX

#f8bbd0

RGB

rgb(248, 187, 208)

RGBA

rgba(248, 187, 208, 1)

HSL

hsl(339, 81%, 85%)

HSV

hsv(339, 25%, 97%)

LAB

lab(81.87% 25.06 -1.95)

LCH

lch(81.87% 25.14 355.55)

OKLAB

oklab(0.8533 0.0748 -0.0048)

OKLCH

oklch(0.8533 0.075 356.33)

XYZ

xyz(67.87, 60.05, 67.68)

CMYK

cmyk(0%, 25%, 16%, 3%)

CSS

color: #f8bbd0;

CSS variable

--color-f8bbd0: #f8bbd0;

SCSS

$color-f8bbd0: #f8bbd0;

Tailwind

pink-100

Export

Developer code

:root {
  --material-pink-100-1: #f8bbd0;
}

Color psychology

Energy, urgency, passion, and excitement. Often used for CTAs, alerts, and brands that want attention.

Usage examples: primary buttons, chart series, status badges, marketing gradients, and brand accents in the Red family.

Material Pink 100