fill property
Sets or retrieves a value that indicates the color to paint the interior of the given graphical element.
![]() ![]() |
Syntax
fill: none | currentColor | funciri | inherit
Property values
none-
Indicates that no paint is applied.
currentColor-
Indicates that painting is done using the current animated value of the color specified by the color property. This enables sharing of color attributes between parent grammars such as other XML—for example, non-SVG. This keyword enables you to define a style in your HTML that sets the color property and then pass that style to the client so that your SVG text will draw in the same color.
funciri-
Indicates an Internationalized Resource Identifier (IRI) reference to a paint server such as a gradient or a pattern. If the IRI reference is not valid (for example, it points to an object that does not exist or the object is not a valid paint server), the paint method following the funciri (for example, none, currentColor, or color) is used if it is provided. Otherwise, the document is in error.
inherit-
Indicates that the property takes the same computed value as the property for the element's parent.
CSS information
| Applies To | shapes and text content elements |
|---|---|
| Media | visual |
| Inherited | 1 |
| Initial Value | black |
Standards information
Remarks
As of Microsoft Edge, this presentation attribute is animatable with CSS Animations and CSS Transitions.
See also
- CSSStyleDeclaration
- currentStyle
- style
- SVGCircleElement
- SVGEllipseElement
- SVGLineElement
- SVGPathElement
- SVGPolygonElement
- SVGPolylineElement
- SVGRectElement
- SVGTextElement
- SVGTextPathElement
- SVGTSpanElement
- stroke

