nuxt-modules / svg-sprite

Optimize SVG files and combine them into sprite
https://codesandbox.io/s/github/nuxt-community/svg-sprite-module/
MIT License
295 stars 41 forks source link

Is it possible to use an icon as a css background-image ? #239

Closed existe-deja closed 3 years ago

existe-deja commented 3 years ago

Hi,

I'm wondering if it's possible, and how if yes, to use an icon incide my css. For exemple: I have some radio button with an icon and I was wondering if I could use the generated sprite also.

Thanks!

bjerh commented 3 years ago

You can use svg-sprites for backgrounds no problem. Just grab the correct outputted path for the generated SVG-sprite file.

background-image: url(directory/path-to-svg-sprite.svg#arrow-right);

Sin1tar commented 2 years ago

how you made it work?

i did the same rule background-image: url('~static/images/icons/sprite.svg#i-user');

but it not working

You can use svg-sprites for backgrounds no problem. Just grab the correct outputted path for the generated SVG-sprite file.

background-image: url(directory/path-to-svg-sprite.svg#arrow-right);

existe-deja commented 2 years ago

I think It will be in your assets more than in your static folder