CSS fill property


CSS fill is a shorthand property of fill-color, fill-image, fill-origin, fill-position, fill-size, and fill-repeat properties.

But the current browsers accept only those color values.


fill : currentColor | color-name | rgb value | hexadecimal value

Property values


currentColor keyword represents the same fill as of text color.

fill: currentColor;


The following demo represents skyblue fill.

fill: skyblue;

rgb value

It represents rgb value of a color.

The rgb value of red fill is given below.

fill: rgb(255,0,0);

hexadecimal value

It represents hexadecimal notation of color.

The hexadecimal notation of blue fill is given below.

fill: #0000ff;

Applicable to

It applies to SVG shapes.

#CSS digger
Was this article helpful?