Polaris 2.0 release candidate

The Polaris 2.0 release candidate is now available for embedded App Home interfaces. It includes the Shopify admin’s new visual styles, allowing your app to adopt the new look.

The new Shopify admin design began rolling out progressively to merchants on September 15, 2026. You can adopt the release candidate now and test your app across both the previous and new Shopify admin designs.

What changes when you adopt Polaris 2.0

When your app uses polaris-2.0-rc.js inside the Shopify admin, its Polaris Web Components match the current visual design of that store:

  • In a store with the new Shopify admin design, components use the new color, typography, spacing, and icons.

  • In a store with the previous Shopify admin design, components keep the same visual style as polaris-1.js.

If you render the components outside the Shopify admin, they default to the new visual style. This lets you test the new appearance before you have access to a store with the new Shopify admin design.

Adopting Polaris 2.0 is explicit. Apps using polaris-1.js or polaris.js URL don’t move to Polaris 2.0 automatically.

What this means for Built for Shopify

If your app is part of Built for Shopify, you have until May 1, 2027 to update your embedded App Home interface to match the Shopify admin’s new visual style.

Using the Polaris 2.0 release candidate lets you prepare during the progressive rollout of the Shopify admin. The components match the visual design available to each store, so the same app can support merchants on either Shopify admin design.

How to test the release candidate

Load the release candidate from the Shopify CDN:

<script src="https://cdn.shopify.com/shopifycloud/polaris-2.0-rc.js"></script>

Then test your app in the following contexts:

  • A store with the new Shopify admin design, if you have access to one.
  • A store with the previous Shopify admin design.
  • Outside the Shopify admin, where components default to the new visual style.

If your app has fixed or sticky content near the bottom of the viewport, use the environment API’s –shopify-safe-area-inset-bottom CSS variable so the floating Sidekick bar doesn’t cover your interface.

Migrate from Polaris React

If your embedded App Home interface uses Polaris React, follow the migration guide for moving to Polaris Web Components.

Start with the Page, Section, and Button components. These components have the largest visual effect when aligning your app with the new Shopify admin design.

If your app already uses Polaris Web Components, update the CDN URL to the release candidate and test your existing interface. If your app doesn’t use Polaris Web Components, migrate first so you can adopt Polaris 2.0.

Extensions update automatically

Admin UI extensions and App Home UI extensions automatically match the Shopify admin design available to each merchant. Their functionality doesn’t change, and you don’t need to update extension code to receive the new styles.

Share your feedback

Reply in this topic if you find:

  • A visual regression between polaris-1.js and polaris-2.0-rc.js.
  • A component that doesn’t match the surrounding Shopify admin design.
  • A layout problem caused by the new spacing, page structure, or buttons

FAQ

Will adopting Polaris 2.0 force the new visual design for every merchant?
No. Inside the Shopify admin, the components match the Shopify admin design available to each store.

Will polaris-1.js or polaris.js automatically move to Polaris 2.0?
No. Moving to a new major version is always an explicit change to your script tag.

How can I test if I don’t have access to a store with the new Shopify admin design?
Render the components outside the Shopify admin. They default to the new visual style.

Do Admin UI extensions or App Home UI extensions need to adopt Polaris 2.0?
No. Extensions automatically receive the Shopify admin design available to each merchant and don’t load Polaris Web Components from the CDN.

When do Built for Shopify apps need to update?
Built for Shopify apps have until May 1, 2027 to update their embedded App Home interface to match the Shopify admin’s new visual style. You will still need to match either the previous or new Shopify admin’s visual style until that time.

Can I use the release candidate in production?
You can, but the release candidate can change before the stable release. Test your app thoroughly and be prepared to update its CDN URL when Polaris 2.0 becomes stable.

Will the polaris-react library be getting an update?
No, the polaris-react library will not be getting an update to match the Shopify admin’s new visual styles.

Related docs

Possibly related to the new admin rollout: the contextual save bar now renders behind an open s-app-window.

We follow the save bar docs (“Save bar in an iframe window”): a <ui-save-bar id="…"> on the parent page, shown with shopify.saveBar.show(id) from inside the s-app-window iframe when the form is dirty. The bar shows, but underneath the app window, so merchants can’t reach Save or Discard.

  • Expected: the save bar sits above the app window
  • Actual: it’s hidden behind the app window
  • Environment: embedded app, App Bridge + Polaris from the CDN, Chrome on macOS

The docs also point two ways. The save bar page recommends a parent ui-save-bar controlled from the iframe, while the app window page shows a <form data-save-bar> inside the window’s own document. Which one is supported for s-app-window with the new admin, and which should sit on top?

Hey Adam, thanks I’ll get someone to take a look at that.

How can I test if I don’t have access to a store with the new Shopify admin design?
Render the components outside the Shopify admin. They default to the new visual style.

That’s not ideal at all. Why is there no way to enable the redesign in a dev store?

@nozwock it should be rolled out already to a number of dev stores. Does yours not have it yet?

+1

We already have our development stores set up with dev apps. Even if the new design gets enabled on my daily dev store, I can no longer easily switch back to the previous design, which is still what the majority of merchants see.

The post says to test across both the previous and new admin designs, but in practice each store only has one. Rendering outside the admin helps for a quick look, but it isn’t a real substitute - we need to see the app embedded, with App Bridge, the save bar, navigation and the Sidekick bar in place.

Could we get a toggle on development stores (a setting or even a URL parameter) to quickly switch between the previous and new admin designs? That would make it much easier to verify both states before moving to polaris-2.0-rc.js.

At a minimum, there should be developer preview for this admin design.

This new design looks a lot like the unified admin UI developer preview from ~2020 :wink:

Do we have the latest Figma UI kit for Polaris 2 yet?

Not sure who at Shopify agreed that those headings should have nearly the same color as the body text. It is really, really bad for the eye to scan the hierarchy with this contrast.

Hey David :waving_hand:

Found a bug on our side: the aside slot doesn’t render as a card with polaris-2.0-rc.js. Main-column sections look right, but the aside ones come out flat: no radius, border or padding, just a white box on the page background. Screenshot below. Is that intended or a regression?

Thanks for the feedback folks. We should have a feature preview available shortly if you don’t already have it available on a store to test.

@DanielPatricio it looks like the background of your page is being set to gray which is making it stand out like this. I would take a look at what’s setting that and turn that off and you’ll notice this side panel blends more into the background.

@ts_team we don’t have an update to the Figma UI kit for Polaris 2 yet

The color of the background isn’t really the concern it is the lack of presence of the card. ie. like on the product page - border, padding etc.

@Kyle_W @Patrick_Jakubik you should now be able to create a Dev store with the “Shopify admin’s new design” feature preview.

this is terrible, the ui-save-bar renders below the s-app-window for iframe components and now nobody can save or discard changes

it was probably claude, the chief programmer