[System] You are a VTEX documentation expert. You provide accurate, detailed information about VTEX platform, APIs, apps, and Store Framework development.

[User] Provide a guide on guides vtex google tag manager in VTEX.

[Assistant]
Documentation

[Feedback](https://read.calvincode.net/reader?url=https://docs.google.com/forms/d/e/1FAIpQLSfmnotPvPjw-SjiE7lt2Nt3RQgNUe10ixXZmuO2v9enOJReoQ/viewform?entry.1972292648=developers.vtex.com%26entry.1799503232=)

[GuidesLearn how to use our APIs and extend the VTEX platform.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/docs/guides)

[API ReferenceExplore detailed information about our endpoints.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/docs/api-reference)

[App DevelopmentLearn how to build cloud-based apps and integrations.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/docs/app-development)

[Storefront DevelopmentExpress your brand identity creating unique storefronts.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/docs/storefront-development)

[VTEX IO AppsFind pre-built solutions to grow your business.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/docs/vtex-io-apps)

[TroubleshootingFind practical solutions to common development issues.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/docs/troubleshooting)

[Release NotesStay up to date with our latest releases and bug fixes.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/updates/release-notes)

Storefront Development

[Getting started with storefront solutions](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/docs/guides/getting-started-with-storefront-solutions)

---

[FastStore](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/docs/guides/faststore)

---

[Store Framework](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/docs/guides/store-framework)

[Store Theme](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/docs/guides/vtex-io-documentation-store-theme)

[Getting started](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/docs/guides/getting-started-3)

Concepts

[Building pages](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/docs/guides/store-framework-building-pages)

[Using components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/docs/guides/store-framework-using-components)

[Using advanced layouts](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/docs/guides/store-framework-using-advanced-layouts)

[Working with Site Editor](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/docs/guides/store-framework-working-with-site-editor)

[Styling](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/docs/guides/store-framework-styling)

[Dealing with events](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/docs/guides/store-framework-dealing-with-events)

[Configuring Analytics (Google Tag Manager)](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/docs/guides/store-framework-configuring-analytics-google-tag-manager)

[Installing Google Tag Manager](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/docs/guides/vtex-io-documentation-installing-google-tag-manager)

[Setting up Google Tag Manager events and triggers](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/docs/guides/vtex-io-documentation-setting-up-google-tag-manager)

[Setting up cross-border stores](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/docs/guides/store-framework-setting-up-cross-border-stores)

[Handling internationalization](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/docs/guides/vtex-io-multi-language-stores)

[Routing](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/docs/guides/store-framework-routing)

[Managing performance](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/docs/guides/store-framework-managing-performance)

[Improving store accessibility with semantic HTML migration](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/docs/guides/vtex-io-documentation-semantic-html-migration)

[Going live](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/docs/guides/vtex-io-documentation-go-live)

[Updating live stores](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/docs/guides/store-framework-updating-live-stores)

---

(Legacy) CMS Portal

---

[Storefront best practices](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/docs/guides/storefront-best-practices)

---

[Guides](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/docs/guides)

[API Reference](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/docs/api-reference)

[App Development](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/docs/app-development)

[Storefront Development](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/docs/storefront-development)

[VTEX IO Apps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/docs/vtex-io-apps)

[Troubleshooting](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/docs/troubleshooting)

---

[Release Notes](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/updates/release-notes)

Storefront Development

[Getting started with storefront solutions](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/docs/guides/getting-started-with-storefront-solutions)

---

[FastStore](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/docs/guides/faststore)

---

[Store Framework](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/docs/guides/store-framework)

[Store Theme](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/docs/guides/vtex-io-documentation-store-theme)

[Getting started](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/docs/guides/getting-started-3)

Concepts

[Building pages](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/docs/guides/store-framework-building-pages)

[Using components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/docs/guides/store-framework-using-components)

[Using advanced layouts](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/docs/guides/store-framework-using-advanced-layouts)

[Working with Site Editor](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/docs/guides/store-framework-working-with-site-editor)

[Styling](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/docs/guides/store-framework-styling)

[Dealing with events](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/docs/guides/store-framework-dealing-with-events)

[Configuring Analytics (Google Tag Manager)](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/docs/guides/store-framework-configuring-analytics-google-tag-manager)

[Installing Google Tag Manager](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/docs/guides/vtex-io-documentation-installing-google-tag-manager)

[Setting up Google Tag Manager events and triggers](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/docs/guides/vtex-io-documentation-setting-up-google-tag-manager)

[Setting up cross-border stores](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/docs/guides/store-framework-setting-up-cross-border-stores)

[Handling internationalization](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/docs/guides/vtex-io-multi-language-stores)

[Routing](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/docs/guides/store-framework-routing)

[Managing performance](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/docs/guides/store-framework-managing-performance)

[Improving store accessibility with semantic HTML migration](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/docs/guides/vtex-io-documentation-semantic-html-migration)

[Going live](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/docs/guides/vtex-io-documentation-go-live)

[Updating live stores](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/docs/guides/store-framework-updating-live-stores)

---

(Legacy) CMS Portal

---

[Storefront best practices](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/docs/guides/storefront-best-practices)

---

[Storefront Development](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/docs/storefront-development)

[Store Framework](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/docs/guides/store-framework)

[Configuring Analytics (Google Tag Manager)](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/docs/guides/store-framework-configuring-analytics-google-tag-manager)

Configuring Analytics (Google Tag Manager)

Discover how to manage Analytics on Store Framework using the Google Tag Manager app.

To manage Analytics on [Store Framework](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework), you need to install the [Google Tag Manager (GTM) app](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/apps/vtex.google-tag-manager), which is a first-party solution that integrates your VTEX account with [Google Tag Manager](https://read.calvincode.net/reader?url=https://tagmanager.google.com), a JavaScript and HTML tag management system provided by Google for tracking user browsing.

The app allows you to manage website tags without accessing the store source code, allowing you to add, edit, or remove tags easily, and provides user browsing tracking for Google Analytics.

> This app is only available for stores built with [Store Framework](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework). For stores built with Legacy CMS Portal, see [Configuring Google Tag Manager](https://read.calvincode.net/reader?url=https://help.vtex.com/en/tutorial/how-to-setup-google-analytics-in-vtex-store--G2P0rmSrEiqCcmUMyUUwG%23configuring-google-tag-manager).

![{"base64":"  ","img":{"width":1920,"height":1368,"type":"png","mime":"image/png","wUnits":"px","hUnits":"px","length":188718,"url":"https://cdn.jsdelivr.net/gh/vtexdocs/dev-portal-content@main/images/google-tag-manager-0.png"}}](https://read.calvincode.net/reader?url=https://cdn.jsdelivr.net/gh/vtexdocs/dev-portal-content@main/images/google-tag-manager-0.png)

[Installing Google Tag ManagerLearn how to install the Google Tag Manager app in your VTEX store.Learn more](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/docs/guides/vtex-io-documentation-installing-google-tag-manager)[Setting up Google Tag ManagerSet up the Google Tag Manager app with variables, triggers, and tags.Learn more](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/docs/guides/vtex-io-documentation-setting-up-google-tag-manager)

Contributors

1

[![Photo of the contributor](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/_next/image?url=https%3A%2F%2Favatars.githubusercontent.com%2Fu%2F112641072%3Fv%3D4%26w=64%26q=75)](https://github.com/barbara-celi)

Was this helpful?

Yes

No

[Suggest Edits (GitHub)](https://read.calvincode.net/reader?url=https://github.com/vtexdocs/dev-portal-content/edit/main/docs/guides/vtex-io/Storefront-Guides/store-framework-configuring-analytics-google-tag-manager.md)

[Using events to trigger side effects on store components« Previous](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager//docs/guides/vtex-io-documentation-using-events-to-trigger-side-effects-on-store-components)[Installing Google Tag ManagerNext »](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager//docs/guides/vtex-io-documentation-installing-google-tag-manager)

Contributors

1

[![Photo of the contributor](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-google-tag-manager/_next/image?url=https%3A%2F%2Favatars.githubusercontent.com%2Fu%2F112641072%3Fv%3D4%26w=64%26q=75)](https://github.com/barbara-celi)

Was this helpful?

 Send feedback

[Suggest edits (GitHub)](https://read.calvincode.net/reader?url=https://github.com/vtexdocs/dev-portal-content/edit/main/docs/guides/vtex-io/Storefront-Guides/store-framework-configuring-analytics-google-tag-manager.md)

Copy page

On this page

On this page

[Github](https://read.calvincode.net/reader?url=https://github.com/vtex-apps)[Help Center](https://read.calvincode.net/reader?url=https://help.vtex.com/)[Community](https://read.calvincode.net/reader?url=https://community.vtex.com/?%5Fga=2.198523433.743584735.1647618303-1974737580.1645714642)[Feedback](https://read.calvincode.net/reader?url=https://docs.google.com/forms/d/e/1FAIpQLSfmnotPvPjw-SjiE7lt2Nt3RQgNUe10ixXZmuO2v9enOJReoQ/viewform?entry.1972292648=developers.vtex.com%26entry.1799503232=)


[System] You are a VTEX documentation expert. You provide accurate, detailed information about VTEX platform, APIs, apps, and Store Framework development.

[User] Provide a guide on guides vtex store components share in VTEX.

[Assistant]
Documentation

[Feedback](https://read.calvincode.net/reader?url=https://docs.google.com/forms/d/e/1FAIpQLSfmnotPvPjw-SjiE7lt2Nt3RQgNUe10ixXZmuO2v9enOJReoQ/viewform?entry.1972292648=developers.vtex.com%26entry.1799503232=)

[GuidesLearn how to use our APIs and extend the VTEX platform.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components-share/docs/guides)

[API ReferenceExplore detailed information about our endpoints.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components-share/docs/api-reference)

[App DevelopmentLearn how to build cloud-based apps and integrations.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components-share/docs/app-development)

[Storefront DevelopmentExpress your brand identity creating unique storefronts.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components-share/docs/storefront-development)

[VTEX IO AppsFind pre-built solutions to grow your business.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components-share/docs/vtex-io-apps)

[TroubleshootingFind practical solutions to common development issues.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components-share/docs/troubleshooting)

[Release NotesStay up to date with our latest releases and bug fixes.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components-share/updates/release-notes)

[Guides](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components-share/docs/guides)

[API Reference](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components-share/docs/api-reference)

[App Development](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components-share/docs/app-development)

[Storefront Development](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components-share/docs/storefront-development)

[VTEX IO Apps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components-share/docs/vtex-io-apps)

[Troubleshooting](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components-share/docs/troubleshooting)

---

[Release Notes](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components-share/updates/release-notes)

Share

The `Share` component allows shoppers to share a product URL via social media. This component can be imported and used by any VTEX app.

![{"base64":"  ","img":{"width":1838,"height":844,"type":"png","mime":"image/png","wUnits":"px","hUnits":"px","length":248489,"url":"https://cdn.jsdelivr.net/gh/vtexdocs/dev-portal-content@main/images/vtex-store-components-share-0.png"}}](https://read.calvincode.net/reader?url=https://cdn.jsdelivr.net/gh/vtexdocs/dev-portal-content@main/images/vtex-store-components-share-0.png)

## Configuration

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

`1

 "dependencies": {

2

 "vtex.store-components": "3.x"

3

 }

`

1. Add the `share` block as a child of the `store.product` template (Product Details Page template). For example:

`1

 "store.product": {

2

 "children": [

3

 "share"

4

 ]

5

 }

`

1. Then, declare the `share` block using the props stated in the [Props](#props) table. For example:

`1

 "share": {

2

 "component": "Share"

3

 }

`

### Props

| Prop name             | Type    | Description                                  | Default value                                                    |
| --------------------- | ------- | -------------------------------------------- | ---------------------------------------------------------------- |
| buttonsContainerClass | String  | Button container classes.                    | true                                                             |
| className             | String  | Main container classes.                      | null                                                             |
| imageUrl              | String  | Image url to share in social medias.         |                                                                  |
| options               | Options | Share button options, such as size.          | {}                                                               |
| shareLabelClass       | String  | Share label classes.                         | true                                                             |
| social                | Social  | Possible social media icons to be displayed. | {Facebook: true, Twitter: true, WhatsApp: true, Pinterest: true} |

#### `options` props:

| Prop name | Type   | Description                             |
| --------- | ------ | --------------------------------------- |
| size      | Number | The size of the share button in pixels. |

#### `social` props:

| Prop name | Type    | Description                             |
| --------- | ------- | --------------------------------------- |
| Facebook  | Boolean | If Facebook social media will be shown. |
| Twitter   | Boolean | If Twitter social media will be shown.  |
| WhatsApp  | Boolean | If WhatsApp social media will be shown. |

## Customization

To apply CSS customizations in this and other blocks, follow the [Using CSS handles for store customization](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-css-handles-for-store-customization) guide.

| CSS Handles       |
| ----------------- |
| shareButtons      |
| shareContainer    |
| shareLabel        |
| shareLoader       |
| shareSocialButton |
| shareSocialIcon   |

Contributors

1

[![Photo of the contributor](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components-share/_next/image?url=https%3A%2F%2Favatars.githubusercontent.com%2Fu%2F60782333%3Fv%3D4%26w=64%26q=75)](https://github.com/carolinamenezes)

Was this helpful?

Yes

No

[Suggest Edits (GitHub)](https://read.calvincode.net/reader?url=https://github.com/vtexdocs/dev-portal-content/edit/main/docs/guides/vtex-io/Store-Framework-Apps/store-components/vtex-store-components-share.md)

Contributors

1

[![Photo of the contributor](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components-share/_next/image?url=https%3A%2F%2Favatars.githubusercontent.com%2Fu%2F60782333%3Fv%3D4%26w=64%26q=75)](https://github.com/carolinamenezes)

ON THIS PAGE

[Configuration](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components-share/docs/guides/vtex-store-components-share%23configuration)

[Props](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components-share/docs/guides/vtex-store-components-share%23props)

[Customization](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components-share/docs/guides/vtex-store-components-share%23customization)

Was this helpful?

 Send feedback

[Suggest edits (GitHub)](https://read.calvincode.net/reader?url=https://github.com/vtexdocs/dev-portal-content/edit/main/docs/guides/vtex-io/Store-Framework-Apps/store-components/vtex-store-components-share.md)

Copy page

On this page

ON THIS PAGE

[Configuration](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components-share/docs/guides/vtex-store-components-share%23configuration)

[Props](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components-share/docs/guides/vtex-store-components-share%23props)

[Customization](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-store-components-share/docs/guides/vtex-store-components-share%23customization)

On this page

[Github](https://read.calvincode.net/reader?url=https://github.com/vtex-apps)[Help Center](https://read.calvincode.net/reader?url=https://help.vtex.com/)[Community](https://read.calvincode.net/reader?url=https://community.vtex.com/?%5Fga=2.198523433.743584735.1647618303-1974737580.1645714642)[Feedback](https://read.calvincode.net/reader?url=https://docs.google.com/forms/d/e/1FAIpQLSfmnotPvPjw-SjiE7lt2Nt3RQgNUe10ixXZmuO2v9enOJReoQ/viewform?entry.1972292648=developers.vtex.com%26entry.1799503232=)


[System] You are a VTEX documentation expert. You provide accurate, detailed information about VTEX platform, APIs, apps, and Store Framework development.

[User] Provide a guide on guides faststore atoms icon in VTEX.

[Assistant]
Documentation

[Feedback](https://read.calvincode.net/reader?url=https://docs.google.com/forms/d/e/1FAIpQLSfmnotPvPjw-SjiE7lt2Nt3RQgNUe10ixXZmuO2v9enOJReoQ/viewform?entry.1972292648=developers.vtex.com%26entry.1799503232=)

[GuidesLearn how to use our APIs and extend the VTEX platform.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides)

[API ReferenceExplore detailed information about our endpoints.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/api-reference)

[App DevelopmentLearn how to build cloud-based apps and integrations.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/app-development)

[Storefront DevelopmentExpress your brand identity creating unique storefronts.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/storefront-development)

[VTEX IO AppsFind pre-built solutions to grow your business.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/vtex-io-apps)

[TroubleshootingFind practical solutions to common development issues.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/troubleshooting)

[Release NotesStay up to date with our latest releases and bug fixes.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/updates/release-notes)

Storefront Development

[Getting started with storefront solutions](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/getting-started-with-storefront-solutions)

---

[FastStore](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore)

[FastStore versions and support levels](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/getting-started-faststore-versions-and-support-levels)

[Getting Started](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/getting-started-overview)

[FastStore WebOps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/webops-dashboard)

[Headless CMS](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/headless-cms-overview)

[Developer tools and references](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/developer-tools-overview)

[Styling](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/styling-overview)

[UI components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/components-index)

[Atoms](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/atoms-overview)

[Badge](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/atoms-badge)

[Button](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/atoms-button)

[Checkbox](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/atoms-checkbox)

[Icon](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/atoms-icon)

[Input](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/atoms-input)

[Label](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/atoms-label)

[Link](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/atoms-link)

[List](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/atoms-list)

[Loader](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/atoms-loader)

[Overlay](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/atoms-overlay)

[Price](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/atoms-price)

[Radio](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/atoms-radio)

[Select](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/atoms-select)

[SROnly](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/atoms-sr-only)

[Skeleton](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/atoms-skeleton)

[Slider](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/atoms-slider)

[Textarea](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/atoms-textarea)

[Molecules](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/molecules-overview)

[Organisms](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/organisms-overview)

[Implementing storefront features](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/storefront-features-overview)

[FastStore API](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/faststore-api-overview)

[FastStore SDK](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/sdk-overview)

[Developing and overriding UI components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/developing-and-overriding-components-overview)

[Extending the FastStore API](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/api-extensions-overview)

[Managing URLs with redirects and rewrite paths](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/routing-managing-urls-with-redirects-and-rewrite-paths)

[Managing performance](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/managing-performance-overview)

[SEO](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/seo-overview)

[Going live](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/go-live-overview)

[Troubleshooting](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/troubleshooting-overview)

---

[Store Framework](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/store-framework)

---

(Legacy) CMS Portal

---

[Storefront best practices](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/storefront-best-practices)

---

[Guides](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides)

[API Reference](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/api-reference)

[App Development](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/app-development)

[Storefront Development](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/storefront-development)

[VTEX IO Apps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/vtex-io-apps)

[Troubleshooting](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/troubleshooting)

---

[Release Notes](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/updates/release-notes)

Storefront Development

[Getting started with storefront solutions](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/getting-started-with-storefront-solutions)

---

[FastStore](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore)

[FastStore versions and support levels](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/getting-started-faststore-versions-and-support-levels)

[Getting Started](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/getting-started-overview)

[FastStore WebOps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/webops-dashboard)

[Headless CMS](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/headless-cms-overview)

[Developer tools and references](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/developer-tools-overview)

[Styling](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/styling-overview)

[UI components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/components-index)

[Atoms](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/atoms-overview)

[Badge](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/atoms-badge)

[Button](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/atoms-button)

[Checkbox](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/atoms-checkbox)

[Icon](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/atoms-icon)

[Input](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/atoms-input)

[Label](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/atoms-label)

[Link](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/atoms-link)

[List](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/atoms-list)

[Loader](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/atoms-loader)

[Overlay](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/atoms-overlay)

[Price](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/atoms-price)

[Radio](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/atoms-radio)

[Select](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/atoms-select)

[SROnly](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/atoms-sr-only)

[Skeleton](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/atoms-skeleton)

[Slider](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/atoms-slider)

[Textarea](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/atoms-textarea)

[Molecules](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/molecules-overview)

[Organisms](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/organisms-overview)

[Implementing storefront features](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/storefront-features-overview)

[FastStore API](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/faststore-api-overview)

[FastStore SDK](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/sdk-overview)

[Developing and overriding UI components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/developing-and-overriding-components-overview)

[Extending the FastStore API](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/api-extensions-overview)

[Managing URLs with redirects and rewrite paths](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/routing-managing-urls-with-redirects-and-rewrite-paths)

[Managing performance](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/managing-performance-overview)

[SEO](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/seo-overview)

[Going live](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/go-live-overview)

[Troubleshooting](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/troubleshooting-overview)

---

[Store Framework](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/store-framework)

---

(Legacy) CMS Portal

---

[Storefront best practices](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/storefront-best-practices)

---

[Storefront development](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/storefront-development)

[FastStore](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore)

[UI components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/components-index)

[Atoms](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/atoms-overview)

Icon

Icons are simplified graphics that represent actions, statuses, and navigation elements, helping users navigate the UI.

[ Source code](https://read.calvincode.net/reader?url=https://github.com/vtex/faststore/tree/main/packages/components/src/atoms/Icon)

The `Icon` component provides SVG-based icons from the FastStore [Iconography library](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/reference-icons), built on top of [Phosphor Icons](https://read.calvincode.net/reader?url=https://phosphoricons.com).

Icons are used across the interface to improve clarity and usability in different contexts, such as:

* **Navigation:** Provide cues that help users move through menus, pages, and the homepage.
* **User actions:** Represent tasks like adding items to the cart, sharing content, or saving to favorites.
* **System feedback:** Indicate statuses such as information, success, warning, or error.
* **Commerce elements:** Represent the cart, account, or checkout.
* **Form inputs:** Improve field usability with search, clearing fields, toggling password visibility, or copying content.
* **Menus and lists:** Indicate dropdowns, pagination, or breadcrumb trails.

> Browse the full set of icons in [Iconography](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/reference-icons).

Example

Code

> The default values for `width` and `height` are `24`.

---

## Usage

### Import the component

`1

import { Icon } from "@faststore/ui";

`

### Import styles

To apply styles, include the following in your stylesheet:

`1

@import "@faststore/ui/src/components/atoms/Icon/styles.scss";

`

For details, see [Importing FastStore UI component styles](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/using-themes-importing-ui-components-styles).

---

## Examples

### Weight

Use the `weight` prop to control the visual stroke weight of the icon. Available options are `thin`, `light`, `regular` (default), and `bold`.

#### Bold

Example

Code

#### Light

Example

Code

#### Regular (default)

Example

Code

#### Thin

Example

Code

### Size

Control icon size with the `width` and `height` props. If omitted, both default to `24` (medium size).

#### Small

Example

Code

#### Medium (default)

Example

Code

#### Large

Example

Code

---

## Design tokens

The `Icon` component does not expose specific design tokens. Customize its appearance using:

* The [weight](#weight) prop (`thin`, `light`, `regular`, `bold`).
* CSS selectors targeting the `[data-fs-icon]` data attribute for layout adjustments. The default theme applies only structural styles to this selector.

---

## Data attributes

You can target and override `Icon` styles using the following data attributes:

`data-fs-icon`

---

## Props

| Name       | Type              | Description                                                                                | Default |             |         |
| ---------- | ----------------- | ----------------------------------------------------------------------------------------------------- | ------- | ----------- | ------- |
| **testId** | string            | ID to find this component in testing tools (e.g.: cypress, testing library, and jest).                | fs-icon |             |         |
| **name\*** | string            | Symbol id from element to render. Take a look at \`/static/icons.svg\`. Example: <Icon name="Bell" /> |         |             |         |
| **weight** | "thin" \| "light" | "regular"                                                                                | "bold"  | SVG weight. | regular |
| **width**  | number            | SVG width.                                                                                | '24'    |             |         |
| **height** | number            | SVG height.                                                                                | '24'    |             |         |

---

## Best practices

### ✅ Do's

* Ensure icons are visually consistent in weight and size within the same context.
* Provide sufficient contrast against varied backgrounds.
* Pair icons with text when meaning may be ambiguous.

### ❌ Don'ts

* Don't rely solely on color or the icon graphic to convey critical meaning.
* Don't mix different icon weights within the same control or pattern.

Contributors

3

[![Photo of the contributor](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/_next/image?url=https%3A%2F%2Favatars.githubusercontent.com%2Fu%2F67270558%3Fv%3D4%26w=64%26q=75)](https://github.com/mariana-caetano)

[![Photo of the contributor](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/_next/image?url=https%3A%2F%2Favatars.githubusercontent.com%2Fu%2F60782333%3Fv%3D4%26w=64%26q=75)](https://github.com/carolinamenezes)

[![Photo of the contributor](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/_next/image?url=https%3A%2F%2Favatars.githubusercontent.com%2Fu%2F62757720%3Fv%3D4%26w=64%26q=75)](https://github.com/aliceoq)

Was this helpful?

Yes

No

[Suggest Edits (GitHub)](https://read.calvincode.net/reader?url=https://github.com/vtexdocs/dev-portal-content/edit/main/docs/faststore/components/atoms/icon.mdx)

[Checkbox« Previous](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/atoms-checkbox)[InputNext »](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/atoms-input)

Contributors

3

[![Photo of the contributor](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/_next/image?url=https%3A%2F%2Favatars.githubusercontent.com%2Fu%2F67270558%3Fv%3D4%26w=64%26q=75)](https://github.com/mariana-caetano)

[![Photo of the contributor](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/_next/image?url=https%3A%2F%2Favatars.githubusercontent.com%2Fu%2F60782333%3Fv%3D4%26w=64%26q=75)](https://github.com/carolinamenezes)

[![Photo of the contributor](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/_next/image?url=https%3A%2F%2Favatars.githubusercontent.com%2Fu%2F62757720%3Fv%3D4%26w=64%26q=75)](https://github.com/aliceoq)

ON THIS PAGE

[Usage](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/atoms-icon%23usage)

[Import the component](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/atoms-icon%23import-the-component)[Import styles](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/atoms-icon%23import-styles)

[Examples](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/atoms-icon%23examples)

[Weight](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/atoms-icon%23weight)[Size](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/atoms-icon%23size)

[Design tokens](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/atoms-icon%23design-tokens)

[Data attributes](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/atoms-icon%23data-attributes)

[Props](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/atoms-icon%23props)

[Best practices](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/atoms-icon%23best-practices)

[✅ Do's](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/atoms-icon%23-dos)[❌ Don'ts](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/atoms-icon%23-donts)

Was this helpful?

 Send feedback

[Suggest edits (GitHub)](https://read.calvincode.net/reader?url=https://github.com/vtexdocs/dev-portal-content/edit/main/docs/faststore/components/atoms/icon.mdx)

Copy page

On this page

ON THIS PAGE

[Usage](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/atoms-icon%23usage)

[Import the component](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/atoms-icon%23import-the-component)[Import styles](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/atoms-icon%23import-styles)

[Examples](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/atoms-icon%23examples)

[Weight](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/atoms-icon%23weight)[Size](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/atoms-icon%23size)

[Design tokens](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/atoms-icon%23design-tokens)

[Data attributes](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/atoms-icon%23data-attributes)

[Props](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/atoms-icon%23props)

[Best practices](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/atoms-icon%23best-practices)

[✅ Do's](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/atoms-icon%23-dos)[❌ Don'ts](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/atoms-icon/docs/guides/faststore/atoms-icon%23-donts)

On this page

[Github](https://read.calvincode.net/reader?url=https://github.com/vtex-apps)[Help Center](https://read.calvincode.net/reader?url=https://help.vtex.com/)[Community](https://read.calvincode.net/reader?url=https://community.vtex.com/?%5Fga=2.198523433.743584735.1647618303-1974737580.1645714642)[Feedback](https://read.calvincode.net/reader?url=https://docs.google.com/forms/d/e/1FAIpQLSfmnotPvPjw-SjiE7lt2Nt3RQgNUe10ixXZmuO2v9enOJReoQ/viewform?entry.1972292648=developers.vtex.com%26entry.1799503232=)


[System] You are a VTEX documentation expert. You provide accurate, detailed information about VTEX platform, APIs, apps, and Store Framework development.

[User] Provide a guide on guides store framework dealing with events in VTEX.

[Assistant]
Documentation

[Feedback](https://read.calvincode.net/reader?url=https://docs.google.com/forms/d/e/1FAIpQLSfmnotPvPjw-SjiE7lt2Nt3RQgNUe10ixXZmuO2v9enOJReoQ/viewform?entry.1972292648=developers.vtex.com%26entry.1799503232=)

[GuidesLearn how to use our APIs and extend the VTEX platform.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/guides)

[API ReferenceExplore detailed information about our endpoints.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/api-reference)

[App DevelopmentLearn how to build cloud-based apps and integrations.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/app-development)

[Storefront DevelopmentExpress your brand identity creating unique storefronts.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/storefront-development)

[VTEX IO AppsFind pre-built solutions to grow your business.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/vtex-io-apps)

[TroubleshootingFind practical solutions to common development issues.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/troubleshooting)

[Release NotesStay up to date with our latest releases and bug fixes.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/updates/release-notes)

Storefront Development

[Getting started with storefront solutions](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/guides/getting-started-with-storefront-solutions)

---

[FastStore](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/guides/faststore)

---

[Store Framework](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/guides/store-framework)

[Store Theme](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/guides/vtex-io-documentation-store-theme)

[Getting started](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/guides/getting-started-3)

Concepts

[Building pages](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/guides/store-framework-building-pages)

[Using components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/guides/store-framework-using-components)

[Using advanced layouts](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/guides/store-framework-using-advanced-layouts)

[Working with Site Editor](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/guides/store-framework-working-with-site-editor)

[Styling](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/guides/store-framework-styling)

[Dealing with events](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/guides/store-framework-dealing-with-events)

[Collecting user session data](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/guides/vtex-io-documentation-collecting-user-session-data)

[Cleaning cart data on log out](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/guides/vtex-io-documentation-cleaning-cart-data-on-log-out)

[Improving filter navigator experience](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/guides/vtex-io-documentation-improving-filter-navigator-experience)

[Using events to trigger side effects on store components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/guides/vtex-io-documentation-using-events-to-trigger-side-effects-on-store-components)

[Configuring Analytics (Google Tag Manager)](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/guides/store-framework-configuring-analytics-google-tag-manager)

[Setting up cross-border stores](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/guides/store-framework-setting-up-cross-border-stores)

[Handling internationalization](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/guides/vtex-io-multi-language-stores)

[Routing](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/guides/store-framework-routing)

[Managing performance](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/guides/store-framework-managing-performance)

[Improving store accessibility with semantic HTML migration](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/guides/vtex-io-documentation-semantic-html-migration)

[Going live](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/guides/vtex-io-documentation-go-live)

[Updating live stores](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/guides/store-framework-updating-live-stores)

---

(Legacy) CMS Portal

---

[Storefront best practices](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/guides/storefront-best-practices)

---

[Guides](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/guides)

[API Reference](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/api-reference)

[App Development](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/app-development)

[Storefront Development](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/storefront-development)

[VTEX IO Apps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/vtex-io-apps)

[Troubleshooting](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/troubleshooting)

---

[Release Notes](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/updates/release-notes)

Storefront Development

[Getting started with storefront solutions](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/guides/getting-started-with-storefront-solutions)

---

[FastStore](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/guides/faststore)

---

[Store Framework](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/guides/store-framework)

[Store Theme](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/guides/vtex-io-documentation-store-theme)

[Getting started](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/guides/getting-started-3)

Concepts

[Building pages](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/guides/store-framework-building-pages)

[Using components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/guides/store-framework-using-components)

[Using advanced layouts](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/guides/store-framework-using-advanced-layouts)

[Working with Site Editor](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/guides/store-framework-working-with-site-editor)

[Styling](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/guides/store-framework-styling)

[Dealing with events](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/guides/store-framework-dealing-with-events)

[Collecting user session data](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/guides/vtex-io-documentation-collecting-user-session-data)

[Cleaning cart data on log out](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/guides/vtex-io-documentation-cleaning-cart-data-on-log-out)

[Improving filter navigator experience](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/guides/vtex-io-documentation-improving-filter-navigator-experience)

[Using events to trigger side effects on store components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/guides/vtex-io-documentation-using-events-to-trigger-side-effects-on-store-components)

[Configuring Analytics (Google Tag Manager)](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/guides/store-framework-configuring-analytics-google-tag-manager)

[Setting up cross-border stores](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/guides/store-framework-setting-up-cross-border-stores)

[Handling internationalization](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/guides/vtex-io-multi-language-stores)

[Routing](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/guides/store-framework-routing)

[Managing performance](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/guides/store-framework-managing-performance)

[Improving store accessibility with semantic HTML migration](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/guides/vtex-io-documentation-semantic-html-migration)

[Going live](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/guides/vtex-io-documentation-go-live)

[Updating live stores](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/guides/store-framework-updating-live-stores)

---

(Legacy) CMS Portal

---

[Storefront best practices](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/guides/storefront-best-practices)

---

[Storefront Development](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/storefront-development)

[Store Framework](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/guides/store-framework)

[Dealing with events](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/guides/store-framework-dealing-with-events)

Dealing with events

Learn how to manage user and system-generated events in your VTEX store.

Events are actions or notifications that trigger specific responses. They provide insights into customer behavior and allow you to create dynamic shopping experiences.

Events can be triggered by user actions in the storefront (e.g., adding an item to the cart) or automatically generated by a system. On VTEX, every event is broadcast to the cloud, where [VTEX IO apps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/vtex-io-apps) can capture and respond to them accordingly. Responses can range from behind-the-scenes actions, such as sending a confirmation email, to visible changes in the storefront, such as displaying a promotional popup or updating the cart.

Moreover, events integrate with analytics tools and third-party apps. Tracking events, such as page views, product impressions, or cart updates, provides metrics on customer behavior, helping businesses make data-driven decisions and optimize store performance. Learn more in the [Analytics](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/storefront-analytics) guide.

In this section, you will learn how to handle your store events.

## Before you begin

### Develop your Store Theme

Make sure your store has a [Store Theme](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-store-theme) developed following the [Getting Started](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/getting-started-3) tutorial.

### Check the builders

Check if the builders are properly installed in your Store Theme. To use builders, your account must have at least version `vtex.builder-hub@0.293.4` installed. Also, you need to specify them in the app's `manifest.json` file. Learn more in [Builders](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-builders).

Make sure the [store builder](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-store-builder) is configured, as it enables the development of Store Framework storefronts.

### Customize your storefront

Customize your store theme based on your business needs by following the guides within the [Store Framework](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework) section, such as the guides [Building pages](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-building-pages) and [Using components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-using-components).

### Learn about VTEX IO apps

Familiarize yourself with [VTEX IO apps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/vtex-io-apps), including how to build custom solutions, such as [Pixel apps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-1-developnativeintegrationswithpixelapps) and [Service](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-service).

## Guides in this section

[Collecting user session dataTrack and configure session data to enhance user interactions.See more](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-collecting-user-session-data)[Cleaning cart data on log outClear the cart when a user logs out of your VTEX store.See more](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-cleaning-cart-data-on-log-out)[Improving filter navigation experienceEnhance the filter navigation in your VTEX store by implementing event-driven updates.See more](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-improving-filter-navigator-experience)[Using events to trigger side effects on store componentsExplore how to use Pixel events to trigger automatic UI changes based on user actions.See more](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/vtex-io-documentation-using-events-to-trigger-side-effects-on-store-components)

Contributors

2

[![Photo of the contributor](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/_next/image?url=https%3A%2F%2Favatars.githubusercontent.com%2Fu%2F60782333%3Fv%3D4%26w=64%26q=75)](https://github.com/carolinamenezes)

[![Photo of the contributor](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/_next/image?url=https%3A%2F%2Favatars.githubusercontent.com%2Fu%2F112641072%3Fv%3D4%26w=64%26q=75)](https://github.com/barbara-celi)

Was this helpful?

Yes

No

[Suggest Edits (GitHub)](https://read.calvincode.net/reader?url=https://github.com/vtexdocs/dev-portal-content/edit/main/docs/guides/vtex-io/Storefront-Guides/store-framework-dealing-with-events.md)

[Using the Markers prop to customize a block's message« Previous](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events//docs/guides/vtex-io-documentation-using-the-markers-prop-to-customize-a-blocks-message)[Collecting user session dataNext »](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events//docs/guides/vtex-io-documentation-collecting-user-session-data)

Contributors

2

[![Photo of the contributor](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/_next/image?url=https%3A%2F%2Favatars.githubusercontent.com%2Fu%2F60782333%3Fv%3D4%26w=64%26q=75)](https://github.com/carolinamenezes)

[![Photo of the contributor](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/_next/image?url=https%3A%2F%2Favatars.githubusercontent.com%2Fu%2F112641072%3Fv%3D4%26w=64%26q=75)](https://github.com/barbara-celi)

ON THIS PAGE

[Before you begin](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/guides/store-framework-dealing-with-events%23before-you-begin)

[Develop your Store Theme](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/guides/store-framework-dealing-with-events%23develop-your-store-theme)[Check the builders](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/guides/store-framework-dealing-with-events%23check-the-builders)[Customize your storefront](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/guides/store-framework-dealing-with-events%23customize-your-storefront)[Learn about VTEX IO apps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/guides/store-framework-dealing-with-events%23learn-about-vtex-io-apps)

[Guides in this section](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/guides/store-framework-dealing-with-events%23guides-in-this-section)

Was this helpful?

 Send feedback

[Suggest edits (GitHub)](https://read.calvincode.net/reader?url=https://github.com/vtexdocs/dev-portal-content/edit/main/docs/guides/vtex-io/Storefront-Guides/store-framework-dealing-with-events.md)

Copy page

On this page

ON THIS PAGE

[Before you begin](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/guides/store-framework-dealing-with-events%23before-you-begin)

[Develop your Store Theme](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/guides/store-framework-dealing-with-events%23develop-your-store-theme)[Check the builders](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/guides/store-framework-dealing-with-events%23check-the-builders)[Customize your storefront](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/guides/store-framework-dealing-with-events%23customize-your-storefront)[Learn about VTEX IO apps](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/guides/store-framework-dealing-with-events%23learn-about-vtex-io-apps)

[Guides in this section](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/store-framework-dealing-with-events/docs/guides/store-framework-dealing-with-events%23guides-in-this-section)

On this page

[Github](https://read.calvincode.net/reader?url=https://github.com/vtex-apps)[Help Center](https://read.calvincode.net/reader?url=https://help.vtex.com/)[Community](https://read.calvincode.net/reader?url=https://community.vtex.com/?%5Fga=2.198523433.743584735.1647618303-1974737580.1645714642)[Feedback](https://read.calvincode.net/reader?url=https://docs.google.com/forms/d/e/1FAIpQLSfmnotPvPjw-SjiE7lt2Nt3RQgNUe10ixXZmuO2v9enOJReoQ/viewform?entry.1972292648=developers.vtex.com%26entry.1799503232=)