[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 organisms shipping simulation 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/organisms-shipping-simulation/docs/guides)

[API ReferenceExplore detailed information about our endpoints.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-shipping-simulation/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/organisms-shipping-simulation/docs/app-development)

[Storefront DevelopmentExpress your brand identity creating unique storefronts.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-shipping-simulation/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/organisms-shipping-simulation/docs/vtex-io-apps)

[TroubleshootingFind practical solutions to common development issues.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-shipping-simulation/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/organisms-shipping-simulation/updates/release-notes)

Storefront Development

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

---

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

[FastStore versions and support levels](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-shipping-simulation/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/organisms-shipping-simulation/docs/guides/faststore/getting-started-overview)

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

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

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

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

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

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

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

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

[BannerText](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-shipping-simulation/docs/guides/faststore/organisms-banner-text)

[CartSidebar](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-shipping-simulation/docs/guides/faststore/organisms-cart-sidebar)

[EmptyState](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-shipping-simulation/docs/guides/faststore/organisms-empty-state)

[FilterSlider](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-shipping-simulation/docs/guides/faststore/organisms-filter-slider)

[Filter](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-shipping-simulation/docs/guides/faststore/organisms-filter)

[Hero](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-shipping-simulation/docs/guides/faststore/organisms-hero)

[ImageGallery](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-shipping-simulation/docs/guides/faststore/organisms-image-gallery)

[NavbarSlider](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-shipping-simulation/docs/guides/faststore/organisms-navbar-slider)

[Navbar](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-shipping-simulation/docs/guides/faststore/organisms-navbar)

[Newsletter](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-shipping-simulation/docs/guides/faststore/organisms-newsletter)

[OutOfStock](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-shipping-simulation/docs/guides/faststore/organisms-out-of-stock)

[PaymentMethods](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-shipping-simulation/docs/guides/faststore/organisms-payment-methods)

[PriceRange](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-shipping-simulation/docs/guides/faststore/organisms-price-range)

[ProductGrid](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-shipping-simulation/docs/guides/faststore/organisms-product-grid)

[ProductShelf](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-shipping-simulation/docs/guides/faststore/organisms-product-shelf)

[RegionModal](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-shipping-simulation/docs/guides/faststore/organisms-region-modal)

[SearchInput](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-shipping-simulation/docs/guides/faststore/organisms-search-input)

[ShippingSimulation](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-shipping-simulation/docs/guides/faststore/organisms-shipping-simulation)

[SlideOver](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-shipping-simulation/docs/guides/faststore/organisms-slide-over)

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

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

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

[Developing and overriding UI components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-shipping-simulation/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/organisms-shipping-simulation/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/organisms-shipping-simulation/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/organisms-shipping-simulation/docs/guides/faststore/managing-performance-overview)

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

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

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

---

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

---

(Legacy) CMS Portal

---

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

---

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

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

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

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

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

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

---

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

Storefront Development

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

---

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

[FastStore versions and support levels](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-shipping-simulation/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/organisms-shipping-simulation/docs/guides/faststore/getting-started-overview)

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

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

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

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

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

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

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

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

[BannerText](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-shipping-simulation/docs/guides/faststore/organisms-banner-text)

[CartSidebar](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-shipping-simulation/docs/guides/faststore/organisms-cart-sidebar)

[EmptyState](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-shipping-simulation/docs/guides/faststore/organisms-empty-state)

[FilterSlider](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-shipping-simulation/docs/guides/faststore/organisms-filter-slider)

[Filter](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-shipping-simulation/docs/guides/faststore/organisms-filter)

[Hero](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-shipping-simulation/docs/guides/faststore/organisms-hero)

[ImageGallery](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-shipping-simulation/docs/guides/faststore/organisms-image-gallery)

[NavbarSlider](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-shipping-simulation/docs/guides/faststore/organisms-navbar-slider)

[Navbar](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-shipping-simulation/docs/guides/faststore/organisms-navbar)

[Newsletter](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-shipping-simulation/docs/guides/faststore/organisms-newsletter)

[OutOfStock](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-shipping-simulation/docs/guides/faststore/organisms-out-of-stock)

[PaymentMethods](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-shipping-simulation/docs/guides/faststore/organisms-payment-methods)

[PriceRange](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-shipping-simulation/docs/guides/faststore/organisms-price-range)

[ProductGrid](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-shipping-simulation/docs/guides/faststore/organisms-product-grid)

[ProductShelf](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-shipping-simulation/docs/guides/faststore/organisms-product-shelf)

[RegionModal](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-shipping-simulation/docs/guides/faststore/organisms-region-modal)

[SearchInput](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-shipping-simulation/docs/guides/faststore/organisms-search-input)

[ShippingSimulation](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-shipping-simulation/docs/guides/faststore/organisms-shipping-simulation)

[SlideOver](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-shipping-simulation/docs/guides/faststore/organisms-slide-over)

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

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

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

[Developing and overriding UI components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-shipping-simulation/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/organisms-shipping-simulation/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/organisms-shipping-simulation/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/organisms-shipping-simulation/docs/guides/faststore/managing-performance-overview)

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

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

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

---

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

---

(Legacy) CMS Portal

---

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

---

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

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

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

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

ShippingSimulation

Sliders that allows users to select a maximum and minimum price.

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

The `ShippingSimulation` component lets customers set the `PostalCode` and see the shipping options in the `PDP`.

Example

Code

## Shipping

Postal Code

[I don't know my Postal Code](/)

---

## Usage

### Import the component

`1

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

`

### Import styles

To apply styles, include the following in your stylesheet:

`1

@import "@faststore/ui/src/components/organisms/ShippingSimulation/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).

---

## Design tokens

| Local token                         | Default value/Global token linked |
| ----------------------------------- | --------------------------------- |
| \--fs-shipping-simulation-text-size | var(--fs-text-size-legend)        |

### Title

| Local token                                    | Default value/Global token linked |
| ---------------------------------------------- | --------------------------------- |
| \--fs-shipping-simulation-title-padding-bottom | var(--fs-spacing-2)               |
| \--fs-shipping-simulation-title-font-size      | var(--fs-text-size-3)             |
| \--fs-shipping-simulation-title-font-weight    | var(--fs-text-weight-bold)        |
| \--fs-shipping-simulation-title-line-height    | 1.2                               |

### Link

| Local token                                | Default value/Global token linked |
| ------------------------------------------ | --------------------------------- |
| \--fs-shipping-simulation-link-padding-top | var(--fs-spacing-1)               |

### Header

| Local token                                  | Default value/Global token linked |
| -------------------------------------------- | --------------------------------- |
| \--fs-shipping-simulation-header-padding-top | var(--fs-spacing-3)               |

### Subtitle

| Local token                                    | Default value/Global token linked |
| ---------------------------------------------- | --------------------------------- |
| \--fs-shipping-simulation-subtitle-size        | var(--fs-text-size-2)             |
| \--fs-shipping-simulation-subtitle-weight      | var(--fs-text-weight-bold)        |
| \--fs-shipping-simulation-subtitle-line-height | 1.5                               |

### Location

| Local token                                       | Default value/Global token linked |
| ------------------------------------------------- | --------------------------------- |
| \--fs-shipping-simulation-location-padding-bottom | var(--fs-spacing-2)               |
| \--fs-shipping-simulation-location-font-size      | var(--fs-text-size-2)             |
| \--fs-shipping-simulation-location-line-height    | 1.5                               |

---

## Data attributes

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

`data-fs-shipping-simulation`

`data-fs-shipping-simulation-title`

`data-fs-shipping-simulation-link`

`data-fs-shipping-simulation-header`

`data-fs-shipping-simulation-subtitle`

`data-fs-shipping-simulation-location`

---

## Props

### ShippingSimulation

| Name                       | Type                                               | Description                                                                            | Default                |
| -------------------------- | -------------------------------------------------- | -------------------------------------------------------------------------------------- | ---------------------- |
| **testId**                 | string                                             | ID to find this component in testing tools (e.g.: cypress, testing-library, and jest). | fs-shipping-simulation |
| **formatter\***            | PriceFormatter                                     | Formatter function that transforms the raw price value and render the result.          |                        |
| **title**                  | string                                             | The Shipping Suggestions Section's title.                                              | Shipping               |
| **inputLabel**             | string                                             | The text displayed to Shipping Simulation input text.                                  | Postal Code            |
| **optionsLabel**           | string                                             | The text displayed in Shipping options table.                                          | Shipping options       |
| **idkPostalCodeLinkProps** | Partial<LinkProps<LinkElementType>>                | Props for the link \`I don't know my Postal Code\`.                                    |                        |
| **onInput**                | (event: React.FormEvent<HTMLInputElement>) => void | Callback function when input is typed.                                                 |                        |
| **onSubmit**               | () => void                                         | Callback function when form is submitted.                                              |                        |
| **onClear**                | () => void                                         | Callback function when the input clear button is clicked.                              |                        |
| **location**               | string                                             | Location for shipping.                                                                 |                        |
| **address**                | Address                                            | Address for shipping.                                                                  |                        |
| **options**                | ShippingSLA\[\]                                    | Options for shipping simulation.                                                       | \[\]                   |
| **displayClearButton**     | false \| true                                      | Show clear button.                                                                     | false                  |
| **errorMessage**           | string                                             | Message of error for input.                                                            |                        |
| **postalCode**             | string                                             | Postal code.                                                                           |                        |

### ShippingSLA

| Name                     | Type   | Description                              | Default |
| ------------------------ | ------ | ---------------------------------------- | ------- |
| **carrier\***            | string | ShippingSLA carrier.                     |         |
| **localizedEstimates\*** | string | ShippingSLA localized shipping estimate. |         |
| **price\***              | number | ShippingSLA price.                       |         |

Contributors

3

[![Photo of the contributor](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-shipping-simulation/_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/organisms-shipping-simulation/_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/organisms-shipping-simulation/_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/organisms/shipping-simulation.mdx)

[SearchInput« Previous](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-shipping-simulation/docs/guides/faststore/organisms-search-input)[SlideOverNext »](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-shipping-simulation/docs/guides/faststore/organisms-slide-over)

Contributors

3

[![Photo of the contributor](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-shipping-simulation/_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/organisms-shipping-simulation/_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/organisms-shipping-simulation/_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/organisms-shipping-simulation/docs/guides/faststore/organisms-shipping-simulation%23usage)

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

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

[Title](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-shipping-simulation/docs/guides/faststore/organisms-shipping-simulation%23title)[Link](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-shipping-simulation/docs/guides/faststore/organisms-shipping-simulation%23link)[Header](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-shipping-simulation/docs/guides/faststore/organisms-shipping-simulation%23header)[Subtitle](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-shipping-simulation/docs/guides/faststore/organisms-shipping-simulation%23subtitle)[Location](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-shipping-simulation/docs/guides/faststore/organisms-shipping-simulation%23location)

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

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

[ShippingSimulation](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-shipping-simulation/docs/guides/faststore/organisms-shipping-simulation%23shippingsimulation)[ShippingSLA](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-shipping-simulation/docs/guides/faststore/organisms-shipping-simulation%23shippingsla)

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/organisms/shipping-simulation.mdx)

Copy page

On this page

ON THIS PAGE

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

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

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

[Title](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-shipping-simulation/docs/guides/faststore/organisms-shipping-simulation%23title)[Link](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-shipping-simulation/docs/guides/faststore/organisms-shipping-simulation%23link)[Header](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-shipping-simulation/docs/guides/faststore/organisms-shipping-simulation%23header)[Subtitle](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-shipping-simulation/docs/guides/faststore/organisms-shipping-simulation%23subtitle)[Location](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-shipping-simulation/docs/guides/faststore/organisms-shipping-simulation%23location)

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

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

[ShippingSimulation](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-shipping-simulation/docs/guides/faststore/organisms-shipping-simulation%23shippingsimulation)[ShippingSLA](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-shipping-simulation/docs/guides/faststore/organisms-shipping-simulation%23shippingsla)

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 add cart items 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/add-cart-items/docs/guides)

[API ReferenceExplore detailed information about our endpoints.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/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/add-cart-items/docs/app-development)

[Storefront DevelopmentExpress your brand identity creating unique storefronts.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/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/add-cart-items/docs/vtex-io-apps)

[TroubleshootingFind practical solutions to common development issues.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/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/add-cart-items/updates/release-notes)

Guides

[VTEX Platform Overview](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/vtex-platform-overview)

---

[API usage](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/api-usage)

---

[Getting started](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/getting-started)

---

Integration Guides

---

[Catalog](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/catalog-integration)

---

[Checkout](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/checkout-api-overview)

[Custom Data](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/custom-data-1)

[Customization](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/customization)

[Discounts](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/discounts)

[Features](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/features)

[Order Placement](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/orders-2)

[Security](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/checkout-security)

[Shopping Cart](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/shopping-cart-section-api-quick-start-guides)

[Simulate a shopping cart](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/simulate-a-shopping-cart)

[Get current or create a new cart](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/create-a-new-cart)

[Get cart information by ID](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/get-cart-information-by-id)

[Remove all items from cart](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/remove-all-items-from-cart)

[Remove all personal data from cart](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/remove-all-personal-data)

[Add cart items](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/add-cart-items)

[Update cart items](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/update-cart-items)

[Change the price of an SKU in a cart](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/change-price)

[Ignore profile data from cart](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/ignore-profile-data)

[Get cart installments information](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/get-cart-installments-information)

[Add coupons to the cart](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/add-coupons-to-the-cart)

[Add a service (offering) to a shopping cart](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/add-service-to-the-cart)

[Cart Attachments](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/cart-attachments-section-api-quick-start-guides)

[Configuration](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/configuration-section-api-quick-start-guides)

[Fulfillment](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/fulfillment-checkout-section-api-quick-start-guides)

[Region](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/region-section-api-quick-start-guides)

[Checkout error codes](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/checkout-error-codes)

---

[Master Data](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/master-data)

---

Payments

---

Orders

---

Logistics

---

B2B Suite

---

VTEX Sales App

---

UI Customization

---

Message Center

---

Pricing

---

Promotions

---

Infrastructure

---

Search

---

Storefront Permissions

---

[VTEX Activity Flow](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/activity-flow)

---

[VTEX Ads](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/vtex-ads)

---

VTEX Session

---

VTEX Shield

---

[Data Protection Plus](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/data-protection-plus)

---

Weni by VTEX

---

[Guides](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides)

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

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

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

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

[Troubleshooting](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/troubleshooting)

---

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

Guides

[VTEX Platform Overview](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/vtex-platform-overview)

---

[API usage](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/api-usage)

---

[Getting started](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/getting-started)

---

Integration Guides

---

[Catalog](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/catalog-integration)

---

[Checkout](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/checkout-api-overview)

[Custom Data](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/custom-data-1)

[Customization](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/customization)

[Discounts](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/discounts)

[Features](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/features)

[Order Placement](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/orders-2)

[Security](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/checkout-security)

[Shopping Cart](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/shopping-cart-section-api-quick-start-guides)

[Simulate a shopping cart](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/simulate-a-shopping-cart)

[Get current or create a new cart](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/create-a-new-cart)

[Get cart information by ID](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/get-cart-information-by-id)

[Remove all items from cart](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/remove-all-items-from-cart)

[Remove all personal data from cart](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/remove-all-personal-data)

[Add cart items](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/add-cart-items)

[Update cart items](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/update-cart-items)

[Change the price of an SKU in a cart](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/change-price)

[Ignore profile data from cart](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/ignore-profile-data)

[Get cart installments information](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/get-cart-installments-information)

[Add coupons to the cart](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/add-coupons-to-the-cart)

[Add a service (offering) to a shopping cart](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/add-service-to-the-cart)

[Cart Attachments](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/cart-attachments-section-api-quick-start-guides)

[Configuration](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/configuration-section-api-quick-start-guides)

[Fulfillment](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/fulfillment-checkout-section-api-quick-start-guides)

[Region](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/region-section-api-quick-start-guides)

[Checkout error codes](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/checkout-error-codes)

---

[Master Data](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/master-data)

---

Payments

---

Orders

---

Logistics

---

B2B Suite

---

VTEX Sales App

---

UI Customization

---

Message Center

---

Pricing

---

Promotions

---

Infrastructure

---

Search

---

Storefront Permissions

---

[VTEX Activity Flow](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/activity-flow)

---

[VTEX Ads](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/vtex-ads)

---

VTEX Session

---

VTEX Shield

---

[Data Protection Plus](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/data-protection-plus)

---

Weni by VTEX

---

[Guides](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides)

[Checkout](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/checkout-api-overview)

[Shopping Cart](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/shopping-cart-section-api-quick-start-guides)

[Add cart items](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/add-cart-items)

Add cart items

The shopping cart is where the information on the products chosen by the customer while browsing a store is gathered. This data may include item prices, shipping value, payment, and delivery methods, among others.

This guide will describe how to add new items to a shopping cart by the API.

## Getting shopping cart information

The first step is to get the `orderFormId` of the shopping cart to which you want to add items. For more information, access the [Get cart information by ID](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/get-cart-information-by-id) guide.

## Adding items to the shopping cart

To add items to the shopping cart, you need to use the [Add cart items](https://read.calvincode.net/reader?url=https://developers.vtex.com/vtex-rest-api/reference/items) endpoint. In this request, you must send the following information through the URL:

* **Path param**: `orderFormId` value.
* **Query param**: `allowedOutdatedData`. You can set up this query as `false` or `true` to define whether some cart information can be updated through the minicart.

See a URL example below:

`https://accountname.environment.com.br/api/checkout/pub/orderForm/ede846222cd44046ba6c638442c3505a/items?allowedOutdatedData=paymentData`

Additionally, you must send the request body containing the following information about the new item to be added to the cart:

* `quantity`
* `seller`
* `id`
* `index`
* `price`

>  `price` should be sent only in case you want to make a bulk price change.

See a request body example below:

`1

{

2

 "orderItems": [

3

 {

4

 "quantity": 3,

5

 "seller": "cosmetics1",

6

 "id": "2005",

7

 "index": 0

8

 }

9

 ]

10

}

`

After sending the request, the endpoint will return the response body containing the shopping cart information including the new item added, as shown in the example below:

`1

...

2

"items": [

3

 {

4

 "uniqueId": "D1E0949706A3441DA0386929FAB6E7E8",

5

 "id": "2005",

6

 "productId": "3",

7

 "productRefId": "",

8

 "refId": null,

9

 "ean": "978020137962",

10

 "name": "Weightless Waves Mild Lather Cleanser 50 ml",

11

 "skuName": "50 ml",

12

 "modalType": null,

13

 "parentItemIndex": null,

14

 "parentAssemblyBinding": null,

15

 "assemblies": [],

16

 "priceValidUntil": "2023-11-07T22:14:44Z",

17

 "tax": 0,

18

 "taxCode": "54WC8ZN6K8",

19

 "price": 3190,

20

 "listPrice": 3190,

21

 "manualPrice": null,

22

 "manualPriceAppliedBy": null,

23

 "sellingPrice": 3107,

24

 "rewardValue": 0,

25

 "isGift": false,

26

 "additionalInfo": {

27

 "dimension": null,

28

 "brandName": "VALDIE&CO",

29

 "brandId": "2000000",

30

 "offeringInfo": null,

31

 "offeringType": null,

32

 "offeringTypeId": null

33

 },

34

 "preSaleDate": null,

35

 "productCategoryIds": "/2/",

36

 "productCategories": {

37

 "2": "Computers"

38

 },

39

 "quantity": 3,

40

 "seller": "cosmetics1",

41

 "sellerChain": [

42

 "cosmetics1"

43

 ],

44

 "imageUrl": "http://cosmetics2.vteximg.com.br/arquivos/ids/155401-55-55/ID-001-MAIN.jpg?v=637109313796670000",

45

 "detailUrl": "/weightless-waves-mild-lather-cleanser/p",

46

 "components": [],

47

 "bundleItems": [],

48

 "attachments": [],

49

 "attachmentOfferings": [],

50

 "offerings": [],

51

 "priceTags": [

52

 {

53

 "name": "discount@price-0e45a4e3-6084-4bf9-bff7-0fe8403699fc#ac2d3d37-5845-45a6-9254-191449d6f100",

54

 "value": -416,

55

 "rawValue": -4.160,

56

 "isPercentual": false,

57

 "identifier": "0e45a4e3-6084-4bf9-bff7-0fe8403699fc",

58

 "owner": "cosmetics2"

59

 }

60

 ],

61

 "availability": "available",

62

 "measurementUnit": "un",

63

 "unitMultiplier": 1.0000,

64

 "manufacturerCode": null,

65

 "priceDefinition": {

66

 "calculatedSellingPrice": 3107,

67

 "total": 15534,

68

 "sellingPrices": [

69

 {

70

 "value": 3107,

71

 "quantity": 4

72

 },

73

 {

74

 "value": 3106,

75

 "quantity": 1

76

 }

77

 ]

78

 }

79

 },

80

...

`

>  For more information about the meaning of each of the fields available in the shopping cart, access the [orderForm](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/orderform-fields) overview.

## Error codes

The following errors may appear as a message in the response body.

### 400 - Bad Request

* **Message error example (code ORD002)**: `"Invalid order form"`. The `orderFormId` information is not valid.

`1

{

2

 "fields": {},

3

 "error": {

4

 "code": "ORD002",

5

 "message": "Invalid order form",

6

 "exception": null

7

 },

8

 "operationId": "5d9f54e6-7db4-46d6-bca9-deeb278b8b98"

9

}

`

* **Message error example (code CHK0024)**: `"Invalid seller for item"`. This message indicates that the `seller` used in the request does not exist, is incorrect or has not been informed.

`1

{

2

 "fields": {},

3

 "error": {

4

 "code": "CHK0024",

5

 "message": "Invalid seller for item",

6

 "exception": null

7

 },

8

 "operationId": "abe5d1b9-a85f-4f10-a3e8-f783082c5c3d"

9

}

`

### 403 - Forbidden

* **Message error example (code CHK003)**: `"Access denied"`. This message indicates that it is not possible to make a bulk price change on this item.

`1

{

2

 "fields": {},

3

 "error": {

4

 "code": "CHK003",

5

 "message": "Access denied",

6

 "exception": null

7

 },

8

 "operationId": "a6ea8b84-68d9-43a7-902e-846e8c5c05b6"

9

}

`

### 404 - Not Found

* **Message error example**: `"The requested URL was not found on the server"`. Check that the URL data is correct.

`1

2

404 Not Found

3

The requested URL was not found on this server.

4

`

Contributors

2

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

[![Photo of the contributor](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/_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/Checkout/shopping-cart-section-api-quick-start-guides/add-cart-items.md)

[Remove all personal data from cart« Previous](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items//docs/guides/remove-all-personal-data)[Update cart itemsNext »](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items//docs/guides/update-cart-items)

Contributors

2

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

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

ON THIS PAGE

[Getting shopping cart information](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/add-cart-items%23getting-shopping-cart-information)

[Adding items to the shopping cart](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/add-cart-items%23adding-items-to-the-shopping-cart)

[Error codes](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/add-cart-items%23error-codes)

[400 - Bad Request](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/add-cart-items%23400-bad-request)[403 - Forbidden](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/add-cart-items%23403-forbidden)[404 - Not Found](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/add-cart-items%23404-not-found)

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/Checkout/shopping-cart-section-api-quick-start-guides/add-cart-items.md)

Copy page

On this page

ON THIS PAGE

[Getting shopping cart information](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/add-cart-items%23getting-shopping-cart-information)

[Adding items to the shopping cart](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/add-cart-items%23adding-items-to-the-shopping-cart)

[Error codes](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/add-cart-items%23error-codes)

[400 - Bad Request](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/add-cart-items%23400-bad-request)[403 - Forbidden](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/add-cart-items%23403-forbidden)[404 - Not Found](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/add-cart-items/docs/guides/add-cart-items%23404-not-found)

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 organisms empty state 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/organisms-empty-state/docs/guides)

[API ReferenceExplore detailed information about our endpoints.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-empty-state/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/organisms-empty-state/docs/app-development)

[Storefront DevelopmentExpress your brand identity creating unique storefronts.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-empty-state/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/organisms-empty-state/docs/vtex-io-apps)

[TroubleshootingFind practical solutions to common development issues.](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-empty-state/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/organisms-empty-state/updates/release-notes)

Storefront Development

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

---

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

[FastStore versions and support levels](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-empty-state/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/organisms-empty-state/docs/guides/faststore/getting-started-overview)

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

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

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

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

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

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

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

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

[BannerText](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-empty-state/docs/guides/faststore/organisms-banner-text)

[CartSidebar](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-empty-state/docs/guides/faststore/organisms-cart-sidebar)

[EmptyState](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-empty-state/docs/guides/faststore/organisms-empty-state)

[FilterSlider](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-empty-state/docs/guides/faststore/organisms-filter-slider)

[Filter](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-empty-state/docs/guides/faststore/organisms-filter)

[Hero](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-empty-state/docs/guides/faststore/organisms-hero)

[ImageGallery](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-empty-state/docs/guides/faststore/organisms-image-gallery)

[NavbarSlider](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-empty-state/docs/guides/faststore/organisms-navbar-slider)

[Navbar](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-empty-state/docs/guides/faststore/organisms-navbar)

[Newsletter](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-empty-state/docs/guides/faststore/organisms-newsletter)

[OutOfStock](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-empty-state/docs/guides/faststore/organisms-out-of-stock)

[PaymentMethods](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-empty-state/docs/guides/faststore/organisms-payment-methods)

[PriceRange](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-empty-state/docs/guides/faststore/organisms-price-range)

[ProductGrid](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-empty-state/docs/guides/faststore/organisms-product-grid)

[ProductShelf](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-empty-state/docs/guides/faststore/organisms-product-shelf)

[RegionModal](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-empty-state/docs/guides/faststore/organisms-region-modal)

[SearchInput](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-empty-state/docs/guides/faststore/organisms-search-input)

[ShippingSimulation](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-empty-state/docs/guides/faststore/organisms-shipping-simulation)

[SlideOver](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-empty-state/docs/guides/faststore/organisms-slide-over)

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

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

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

[Developing and overriding UI components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-empty-state/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/organisms-empty-state/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/organisms-empty-state/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/organisms-empty-state/docs/guides/faststore/managing-performance-overview)

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

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

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

---

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

---

(Legacy) CMS Portal

---

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

---

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

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

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

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

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

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

---

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

Storefront Development

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

---

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

[FastStore versions and support levels](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-empty-state/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/organisms-empty-state/docs/guides/faststore/getting-started-overview)

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

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

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

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

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

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

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

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

[BannerText](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-empty-state/docs/guides/faststore/organisms-banner-text)

[CartSidebar](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-empty-state/docs/guides/faststore/organisms-cart-sidebar)

[EmptyState](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-empty-state/docs/guides/faststore/organisms-empty-state)

[FilterSlider](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-empty-state/docs/guides/faststore/organisms-filter-slider)

[Filter](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-empty-state/docs/guides/faststore/organisms-filter)

[Hero](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-empty-state/docs/guides/faststore/organisms-hero)

[ImageGallery](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-empty-state/docs/guides/faststore/organisms-image-gallery)

[NavbarSlider](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-empty-state/docs/guides/faststore/organisms-navbar-slider)

[Navbar](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-empty-state/docs/guides/faststore/organisms-navbar)

[Newsletter](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-empty-state/docs/guides/faststore/organisms-newsletter)

[OutOfStock](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-empty-state/docs/guides/faststore/organisms-out-of-stock)

[PaymentMethods](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-empty-state/docs/guides/faststore/organisms-payment-methods)

[PriceRange](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-empty-state/docs/guides/faststore/organisms-price-range)

[ProductGrid](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-empty-state/docs/guides/faststore/organisms-product-grid)

[ProductShelf](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-empty-state/docs/guides/faststore/organisms-product-shelf)

[RegionModal](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-empty-state/docs/guides/faststore/organisms-region-modal)

[SearchInput](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-empty-state/docs/guides/faststore/organisms-search-input)

[ShippingSimulation](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-empty-state/docs/guides/faststore/organisms-shipping-simulation)

[SlideOver](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-empty-state/docs/guides/faststore/organisms-slide-over)

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

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

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

[Developing and overriding UI components](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-empty-state/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/organisms-empty-state/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/organisms-empty-state/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/organisms-empty-state/docs/guides/faststore/managing-performance-overview)

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

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

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

---

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

---

(Legacy) CMS Portal

---

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

---

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

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

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

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

EmptyState

Represents the component's empty state while the main content is loading.

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

The `EmptyState` can be used to represent an empty state.

Example

Code

Your Cart is empty

Start Shopping

---

## Usage

### Import the component

`1

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

`

### Import styles

To apply styles, include the following in your stylesheet:

`1

@import "@faststore/ui/src/components/organisms/EmptyState/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

### Variants

#### Rounded

Example

Code

Nothing matches with your search

Browse Offers

## Design tokens

| Local token                  | Default value/Global token linked |
| ---------------------------- | --------------------------------- |
| \--fs-empty-state-height     | 100%                              |
| \--fs-empty-state-min-height | 50vh                              |
| \--fs-empty-state-padding    | 0 var(--fs-spacing-8)             |

### Design tokens: Title

| Local token                           | Default value/Global token linked |
| ------------------------------------- | --------------------------------- |
| \--fs-empty-state-title-margin-bottom | var(--fs-spacing-2)               |
| \--fs-empty-state-title-color         | var(--fs-color-disabled-text)     |
| \--fs-empty-state-title-size          | var(--fs-text-size-lead)          |

### Design tokens: Link

| Local token                      | Default value/Global token linked |
| -------------------------------- | --------------------------------- |
| \--fs-empty-state-link-min-width | 11.875rem                         |

### Design tokens: Rounded

| Local token                     | Default value/Global token linked |
| ------------------------------- | --------------------------------- |
| \--fs-empty-state-border-radius | var(--fs-border-radius)           |

### Design tokens: Default background color

| Local token                         | Default value/Global token linked |
| ----------------------------------- | --------------------------------- |
| \--fs-empty-state-bkg-color-default | var(--fs-color-neutral-bkg)       |

### Design tokens: White background color

| Local token                       | Default value/Global token linked |
| --------------------------------- | --------------------------------- |
| \--fs-empty-state-bkg-color-light | var(--fs-color-body-bkg)          |

---

## Data attributes

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

`data-fs-empty-state`

`data-fs-empty-state-title`

`data-fs-empty-state-variant="default | rounded"`

`data-fs-empty-state-bkg-color="default | white"`

---

## Props

| Name          | Type                   | Description                                                                            | Default        |    |                          |                             |                     |             |                                                                  |
| ------------- | ---------------------- | -------------------------------------------------------------------------------------- | -------------- | -- | ------------------------ | --------------------------- | ------------------- | ----------- | ---------------------------------------------------------------- |
| **testId**    | string                 | ID to find this component in testing tools (e.g.: cypress, testing library, and jest). | fs-empty-state |    |                          |                             |                     |             |                                                                  |
| **title**     | string                 | The EmptyState component's title.                                                      |                |    |                          |                             |                     |             |                                                                  |
| **titleIcon** | string \| number       | false                                                                                | true           | {} | ReactElement<any, string | JSXElementConstructor<any>> | Iterable<ReactNode> | ReactPortal | A React component that will be rendered as an icon on the Title. |
| **variant**   | "default" \| "rounded" | Specifies the component border variant.                                                | default        |    |                          |                             |                     |             |                                                                  |
| **bkgColor**  | "default" \| "light"   | Specifies the component background color.                                              | default        |    |                          |                             |                     |             |                                                                  |

Contributors

3

[![Photo of the contributor](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-empty-state/_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/organisms-empty-state/_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/organisms-empty-state/_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/organisms/empty-state.mdx)

[CartSidebar« Previous](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-empty-state/docs/guides/faststore/organisms-cart-sidebar)[FilterSliderNext »](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-empty-state/docs/guides/faststore/organisms-filter-slider)

Contributors

3

[![Photo of the contributor](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-empty-state/_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/organisms-empty-state/_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/organisms-empty-state/_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/organisms-empty-state/docs/guides/faststore/organisms-empty-state%23usage)

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

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

[Variants](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-empty-state/docs/guides/faststore/organisms-empty-state%23variants)

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

[Design tokens: Title](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-empty-state/docs/guides/faststore/organisms-empty-state%23design-tokens-title)[Design tokens: Link](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-empty-state/docs/guides/faststore/organisms-empty-state%23design-tokens-link)[Design tokens: Rounded](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-empty-state/docs/guides/faststore/organisms-empty-state%23design-tokens-rounded)[Design tokens: Default background color](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-empty-state/docs/guides/faststore/organisms-empty-state%23design-tokens-default-background-color)[Design tokens: White background color](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-empty-state/docs/guides/faststore/organisms-empty-state%23design-tokens-white-background-color)

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

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

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/organisms/empty-state.mdx)

Copy page

On this page

ON THIS PAGE

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

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

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

[Variants](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-empty-state/docs/guides/faststore/organisms-empty-state%23variants)

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

[Design tokens: Title](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-empty-state/docs/guides/faststore/organisms-empty-state%23design-tokens-title)[Design tokens: Link](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-empty-state/docs/guides/faststore/organisms-empty-state%23design-tokens-link)[Design tokens: Rounded](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-empty-state/docs/guides/faststore/organisms-empty-state%23design-tokens-rounded)[Design tokens: Default background color](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-empty-state/docs/guides/faststore/organisms-empty-state%23design-tokens-default-background-color)[Design tokens: White background color](https://read.calvincode.net/reader?url=https://developers.vtex.com/docs/guides/faststore/organisms-empty-state/docs/guides/faststore/organisms-empty-state%23design-tokens-white-background-color)

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

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

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=)