How do I convert SVG inline styles to attributes?

Paste SVG and click Convert to attributes to expand style="..." into fill, stroke, and friends.

Why prefer presentation attributes over inline styles?

Some optimizers and icon pipelines expect attributes instead of CSS declarations.

Open Attributes → Inline to move the other way.

FAQ

Quick answers

How do I convert SVG inline styles to attributes?: Paste SVG and click Convert to attributes to expand style="..." into fill, stroke, and friends.
Why prefer presentation attributes over inline styles?: Some optimizers and icon pipelines expect attributes instead of CSS declarations.
Need the reverse conversion?: Open Attributes → Inline to move the other way.
Is this conversion free in the browser?: Yes — free, no upload.

Source

Ready

React component

React Native (react-native-svg)

PNG export · 2× for retina

0 B