6 ms·

Ideally this is applied as a webpack transform, so the asset is left as SVG, and only converted during the build process. Inlining the SVG as Base 64 in CSS is

Ideally this is applied as a webpack transform, so the asset is left as SVG, and only converted during the build process. Inlining the SVG as Base 64 in CSS is not that good, since it limits what you can do with it (basically setting it as a background). If you create an actual SVG tag within HTML (via React) you can then use CSS to style the strokes, fills, etc.

rpastuszak 9y ago
Base64-encoded SVGs have a terrible impact on performance on mobile, so I'd be careful with that. Saying that, the situation has improved in the past few years (mostly because of hardware, not browser optimisations afair)