--- api_version: 2025-10 api_name: customer-account-ui-extensions source_url: html: https://shopify.dev/docs/api/customer-account-ui-extensions/latest/polaris-web-components md: https://shopify.dev/docs/api/customer-account-ui-extensions/latest/polaris-web-components.md --- # Polaris web components ## Additional components In addition to the components below, you can also use checkout components to build customer account UI extensions. [![](https://shopify.dev/images/icons/32/blocks.png)![](https://shopify.dev/images/icons/32/blocks-dark.png)](https://shopify.dev/docs/api/checkout-ui-extensions/polaris-web-components) [More componentsCheckout components](https://shopify.dev/docs/api/checkout-ui-extensions/polaris-web-components) ## Actions [![ButtonGroup](https://shopify.dev/images/templated-apis-screenshots/customer-account-ui-extensions/2025-10/buttongroup-thumbnail.png)![ButtonGroup](https://shopify.dev/images/templated-apis-screenshots/customer-account-ui-extensions/2025-10/buttongroup-thumbnail.png)](https://shopify.dev/docs/api/customer-account-ui-extensions/latest/polaris-web-components/actions/buttongroup) [Button​Group](https://shopify.dev/docs/api/customer-account-ui-extensions/latest/polaris-web-components/actions/buttongroup) [ButtonGroup is used to display multiple buttons in a layout that is contextual based on the screen width or parent component. When there is more than one secondary action, they get collapsed.](https://shopify.dev/docs/api/customer-account-ui-extensions/latest/polaris-web-components/actions/buttongroup) [![CustomerAccountAction](https://shopify.dev/images/templated-apis-screenshots/customer-account-ui-extensions/2025-10/customeraccountaction-thumbnail.png)![CustomerAccountAction](https://shopify.dev/images/templated-apis-screenshots/customer-account-ui-extensions/2025-10/customeraccountaction-thumbnail.png)](https://shopify.dev/docs/api/customer-account-ui-extensions/latest/polaris-web-components/actions/customeraccountaction) [Customer​Account​Action](https://shopify.dev/docs/api/customer-account-ui-extensions/latest/polaris-web-components/actions/customeraccountaction) [A modal to complete an order action flow. This component can only be used to populate the customer-account.order.action.render extension target, which renders as a result of the customer clicking the order action button rendered via the customer-account.order.action.menu-item.render extension target.](https://shopify.dev/docs/api/customer-account-ui-extensions/latest/polaris-web-components/actions/customeraccountaction) [![Menu](https://shopify.dev/images/templated-apis-screenshots/customer-account-ui-extensions/2025-10/menu-thumbnail.png)![Menu](https://shopify.dev/images/templated-apis-screenshots/customer-account-ui-extensions/2025-10/menu-thumbnail.png)](https://shopify.dev/docs/api/customer-account-ui-extensions/latest/polaris-web-components/actions/menu) [Menu](https://shopify.dev/docs/api/customer-account-ui-extensions/latest/polaris-web-components/actions/menu) [Use a menu to display a list of actions in a popover. Actions can open a modal, trigger an event, or link to an external page.](https://shopify.dev/docs/api/customer-account-ui-extensions/latest/polaris-web-components/actions/menu) ## Media [![Avatar](https://shopify.dev/images/templated-apis-screenshots/customer-account-ui-extensions/2025-10/avatar-thumbnail.png)![Avatar](https://shopify.dev/images/templated-apis-screenshots/customer-account-ui-extensions/2025-10/avatar-thumbnail.png)](https://shopify.dev/docs/api/customer-account-ui-extensions/latest/polaris-web-components/media/avatar) [Avatar](https://shopify.dev/docs/api/customer-account-ui-extensions/latest/polaris-web-components/media/avatar) [Avatar component is used to show a thumbnail representation of an individual or business in the interface. It can be a graphical representation or visual depiction, such as an image, initials, or an icon.](https://shopify.dev/docs/api/customer-account-ui-extensions/latest/polaris-web-components/media/avatar) [![ImageGroup](https://shopify.dev/images/templated-apis-screenshots/customer-account-ui-extensions/2025-10/imagegroup-thumbnail.png)![ImageGroup](https://shopify.dev/images/templated-apis-screenshots/customer-account-ui-extensions/2025-10/imagegroup-thumbnail.png)](https://shopify.dev/docs/api/customer-account-ui-extensions/latest/polaris-web-components/media/imagegroup) [Image​Group](https://shopify.dev/docs/api/customer-account-ui-extensions/latest/polaris-web-components/media/imagegroup) [Display up to 4 images in a grid or stacked layout. The images are displayed as a grid when used within a Section component. For example, images of products in a wishlist or subscription. When there are more than 4 images, the component indicates how many more images are not displayed.](https://shopify.dev/docs/api/customer-account-ui-extensions/latest/polaris-web-components/media/imagegroup) ## Structure [![Page](https://shopify.dev/images/templated-apis-screenshots/customer-account-ui-extensions/2025-10/page-thumbnail.png)![Page](https://shopify.dev/images/templated-apis-screenshots/customer-account-ui-extensions/2025-10/page-thumbnail.png)](https://shopify.dev/docs/api/customer-account-ui-extensions/latest/polaris-web-components/structure/page) [Page](https://shopify.dev/docs/api/customer-account-ui-extensions/latest/polaris-web-components/structure/page) [The outer wrapper of the page—including the page title, subtitle, and page-level actions—displayed in a familiar and consistent style that sets expectations about the purpose of the page.](https://shopify.dev/docs/api/customer-account-ui-extensions/latest/polaris-web-components/structure/page) [![Section](https://shopify.dev/images/templated-apis-screenshots/customer-account-ui-extensions/2025-10/section-thumbnail.png)![Section](https://shopify.dev/images/templated-apis-screenshots/customer-account-ui-extensions/2025-10/section-thumbnail.png)](https://shopify.dev/docs/api/customer-account-ui-extensions/latest/polaris-web-components/structure/section) [Section](https://shopify.dev/docs/api/customer-account-ui-extensions/latest/polaris-web-components/structure/section) [Groups related content into clearly-defined thematic areas. Sections have contextual styling that automatically adapts based on nesting depth. They also adjust heading levels to maintain a meaningful and accessible page structure.](https://shopify.dev/docs/api/customer-account-ui-extensions/latest/polaris-web-components/structure/section)