Serg Hospodarets Blog

Serg Hospodarets blog

Generate colors from CSS custom properties (R,G,B)

Color components:

Color:

rgba(var(--r), var(--g), var(--b), 1);

Filtered colors:

Grayscale
rgba( calc(0.2126 * var(--r)), calc(0.7152 * var(--g)), calc(0.0722 * var(--b)), 1 );
Invert
rgba( calc(255 - var(--r)), calc(255 - var(--g)), calc(255 - var(--b)), 1 );
Sepia
rgba( calc(var(--r) * 0.393 + var(--g) * 0.769 + var(--b) * 0.189), calc(var(--r) * 0.349 + var(--g) * 0.686 + var(--b) * 0.168), calc(var(--r) * 0.272 + var(--g) * 0.534 + var(--b) * 0.131), 1 );