Utilities

SVG

Panda provides utilities for styling SVG elements.

Fill

Change the fill color of an SVG element.

<svg className={css({ fill: 'blue.500' })} />
PropCSS PropertyToken Category
fillfillcolors

Stroke

Change the stroke color of an SVG element.

<div className={css({ stroke: 'blue.500' })} />
PropCSS PropertyToken Category
strokestrokecolors

Stroke Width

Change the stroke width of an SVG element.

<div className={css({ strokeWidth: '1px' })} />
PropCSS PropertyToken Category
strokeWidthstroke-widthborderWidths