VSnack
Vuero provides a <VSnack />
component than can be used to show a pill with an image. Use the image
prop to insert an image inside the component.
![](https://media.cssninja.io/content/photos/misc/buoy.jpg)
![](https://media.cssninja.io/content/avatars/7.jpg)
VSnack white
Vuero provides a <VSnack />
component than can be used to show a pill with an image. Use the image
prop to insert an image inside the component. You cna also use the white
prop to make the component background white.
![](https://media.cssninja.io/content/photos/misc/buoy.jpg)
![](https://media.cssninja.io/content/avatars/7.jpg)
Lucide Icons
Vuero provides a <VSnack />
component than can be used to show a pill with an icon. Use the available slots
prop to insert your content. Check the markup for more details.
Feather solid
Vuero provides a <VSnack />
component than can be used to show a pill with an icon. Use the available slots
prop to insert your content. Add the solid
prop to the component if you want to show a solid icon. Check the markup for more details.
Font Awesome
Vuero provides a <VSnack />
component than can be used to show a pill with an icon. Use the available slots
prop to insert your content. Check the markup for more details.
Font Awesome solid
Vuero provides a <VSnack />
component than can be used to show a pill with an icon. Use the available slots
prop to insert your content. Add the solid
prop to the component if you want to show a solid icon. Check the markup for more details.
Line Icons
Vuero provides a <VSnack />
component than can be used to show a pill with an icon. Use the available slots
prop to insert your content. Check the markup for more details.
Line Icons solid
Vuero provides a <VSnack />
component than can be used to show a pill with an icon. Use the available slots
prop to insert your content. Add the solid
prop to the component if you want to show a solid icon. Check the markup for more details.
Small images
<VSnack />
components than can be displayed in a smaller size. Use the size="small"
prop on the component to show a smaller version of it.
![](https://media.cssninja.io/content/photos/misc/buoy.jpg)
![](https://media.cssninja.io/content/avatars/7.jpg)
Small icons
<VSnack />
components than can be displayed in a smaller size. Use the size="small"
prop on the component to show a smaller version of it.