Material Pink 300

Preview

Material Pink 300

#f06292

Overview

Family: Red

material

Accessibility on this swatch:

(6.87:1)

Contrast vs white: 3.06:1 · vs black: 6.87:1

Formats

HEX

#f06292

RGB

rgb(240, 98, 146)

RGBA

rgba(240, 98, 146, 1)

HSL

hsl(340, 83%, 66%)

HSV

hsv(340, 59%, 94%)

LAB

lab(61.08% 58.87 2.1)

LCH

lch(61.08% 58.91 2.04)

OKLAB

oklab(0.6878 0.1796 0.0062)

OKLCH

oklch(0.6878 0.1797 1.98)

XYZ

xyz(45.49, 29.34, 30.46)

CMYK

cmyk(0%, 59%, 39%, 6%)

CSS

color: #f06292;

CSS variable

--color-f06292: #f06292;

SCSS

$color-f06292: #f06292;

Tailwind

rose-300

Export

Developer code

:root {
  --material-pink-300-1: #f06292;
}

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 300