The image block renders images in the storefront.

1. Import the vtex.store-components app to your theme dependencies in the manifest.json file as in the following example:

2. Add the image block to any template you choose.
3. Then, declare the image block using the props stated in the Props table. For example:

Prop name	Type	Description	Default value
alt	string	Alternate text for the image.	-
link	Link	The image hyperlink. For more details on the props of the link, please see the following table.	-
maxHeight	string	Maximum height of the image.	-
maxWidth	string	Maximum width of the image.	-
sizes	string	Different image sizes for each page layout.	-
src	string	Source URL of the image.	-
srcSet	string	URL of the image to use in different situations.	-
title	string	Image title displayed on hover.	-

• link props:

Prop name	Type	Description	Default value
attributeNofollow	boolean	Guides the search engine not to track the link of the page indicated by the tag. If true, sets the rel=noFollow attribute to the link.	false
newTab	boolean	If true opens a new tab when you click the image.	false
url	string	Sets the URL to which the user will be redirected by clicking the image.	-

To apply CSS customizations to this and other blocks, please read the Using CSS handles for store customization guide.

CSS Handles
imageElement