---
title: 'Feature preview: Customer account improvements'
description: >-
  Learn about the design updates coming to customer accounts and where extension
  targets will render in the new layout.
source_url:
  html: >-
    https://shopify.dev/docs/apps/build/customer-accounts/feature-preview-customer-account-improvements
  md: >-
    https://shopify.dev/docs/apps/build/customer-accounts/feature-preview-customer-account-improvements.md
---

# Feature preview: Customer account improvements

Customer accounts are getting design updates to improve navigation, layout, visual design, consistency across devices, visibility of UI extensions, and more. Use this early preview to test your customer account UI extensions in the updated design.

These improvements create a more polished, consistent experience for customer accounts, and a stronger foundation for the UI extensions you build on top of them. The new single-column layout paired with responsive values means your UI extensions will render more predictably across screen sizes. More visible order action and order summary extensions also mean the features you build will be easier for customers to discover and use.

These changes don't break your existing work. All current extension targets remain supported, but testing now will ensure your extensions will continue to look as intended when these design updates are released to merchants. What you'll see is a work-in-progress version. We'll keep making improvements throughout the preview, so your feedback directly shapes what merchants get at GA.

***

## What's changing

* Native page layouts are now single-column by default. Full-page extensions will default to full width, but you can choose to apply the narrower width.
* Existing extension targets are mapped to the new layout. See [extension targets by page](#extension-targets-by-page) for more information.
* Layout is simplified and consistent across desktop and mobile.
* Navigation is visible on desktop and mobile.
* More order action UI extensions are displayed inline.
* Order summary UI extensions are displayed inline, not collapsed on mobile.
* Avatar image is consistent with the [account component](https://shopify.dev/docs/storefronts/themes/customer-engagement/account-component).

***

## Prepare your extensions for the new layout

### Enable the feature preview

Get early access to the changes by [enabling](https://shopify.dev/docs/api/feature-previews#enable-a-feature-preview) the **Customer account improvements** feature preview on a development store.

**Caution:**

Feature previews are still under development and are subject to change.

### Update to API version 2025-10 or later

If your extension uses API version 2025-07 or earlier, you should consider [updating to 2025-10 or later](https://shopify.dev/docs/apps/build/customer-accounts/migrate-to-web-components) to adopt Polaris web components.

If your extension uses API version 2025-10 or later, wrap any inline UI extensions that render on native pages in [`<s-query-container>`](https://shopify.dev/docs/api/customer-account-ui-extensions/latest/web-components/layout-and-structure/query-container) and use [responsive values](https://shopify.dev/docs/api/customer-account-ui-extensions/latest/using-web-components#responsive-values) so the content automatically adjusts to different screen sizes.

### Test your UI extensions

Test your UI extensions —especially full-page extensions— in the context of the updated design.

### Apply the narrow page width (optional)

To apply the narrow page width to your full-page extension, wrap your extension in the following code, depending on what API version you're using:

**2026-07 or later:**

In this API version, full page extensions built with the `Page` component default to the narrow width automatically. Should you require the additional space on desktop, set `inlineSize="large"` on the `Page`.

**2025-10 to 2026-04:**

## jsx

```jsx
<s-grid gridTemplateColumns="minmax(auto, 64rem)" justifyContent="center">
  {/* full page extension */}
</s-grid>
```

**2025-07 or earlier:**

## jsx

```jsx
<Grid columns={Style.default(['fill']).when({viewportInlineSize: {min: 'small'}}, ['fill', 640, 'fill'])}>
  <View display={Style.default('none').when({viewportInlineSize: {min: 'small'}}, 'auto')} />
  {/* full page extension */}
  <View display={Style.default('none').when({viewportInlineSize: {min: 'small'}}, 'auto')} />
</Grid>
```

***

## Extension targets by page

See where the existing customer account extension targets will be rendered in the new layout.

### Full-page extension (Default width)

![Diagram of customer accounts showing where full-page extension targets render on the page, using the default width.](https://shopify.dev/assets/assets/images/apps/customer-accounts/feature-preview-customer-account-improvements/full-page-extension-default-ry1QyPOo.png)

### Full-page extension (Narrow width)

Adapt your full-page extension to use the narrow width by following [these instructions](#apply-the-narrow-page-width-optional).

![Diagram of customer accounts showing where full-page extension targets render on the page, using the narrow width.](https://shopify.dev/assets/assets/images/apps/customer-accounts/feature-preview-customer-account-improvements/full-page-extension-narrow-De_e02hZ.png)

### Order index

![Diagram of the Order index page in customer accounts, showing where extension targets render on the page.](https://shopify.dev/assets/assets/images/apps/customer-accounts/feature-preview-customer-account-improvements/order-index-Bdlc_OqQ.png)

### Order status

![Diagram of the Order status page in customer accounts, showing where extension targets render on the page.](https://shopify.dev/assets/assets/images/apps/customer-accounts/feature-preview-customer-account-improvements/order-status-CYbqm5F0.png)

### Profile (Default)

![Diagram of the default Profile page in customer accounts, showing where extension targets render on the page.](https://shopify.dev/assets/assets/images/apps/customer-accounts/feature-preview-customer-account-improvements/profile-default-BA4SgZIJ.png)

### Profile (B2B)

![Diagram of the Profile page for B2B customers, showing where extension targets render on the page.](https://shopify.dev/assets/assets/images/apps/customer-accounts/feature-preview-customer-account-improvements/profile-b2b-Cmt4-u8W.png)

***