Skip to content

Shopify Dude Release Breakdown

Shopify Polaris 2.0: Why Your Embedded App Still Looks Like the Old Admin

Shopify’s September 2026 admin redesign does not automatically restyle custom App Home interfaces. Here’s how to adopt the Polaris 2.0 release candidate safely.

Quick answer

Shopify began rolling out its redesigned admin on September 15, 2026. Admin UI extensions and App Home UI extensions adopt the new appearance automatically, but custom embedded App Home interfaces do not. If your embedded app still looks like the old admin, check whether it renders Polaris React, hand-written CSS, or Polaris Web Components 1.x. The Polaris 2.0 release candidate, announced September 24, is an explicit opt-in for embedded App Home interfaces.

As of October 11, 2026, Polaris 2.0 is still a release candidate, not the stable channel. Test it before switching a production app; do not assume the old unversioned script will upgrade itself.

On this page

Why the surrounding Shopify admin changes but your app does not

Embedded App Home pages render inside an iframe. Shopify controls the surrounding navigation and admin frame, while your app controls its own UI. When the merchant’s admin gets a new look, Shopify does not rewrite your React components or custom CSS. A legacy @shopify/polaris interface can therefore sit inside the new admin looking visibly different.

The distinction is between UI extensions, which Shopify renders and styles, and custom embedded App Home pages, which your app renders. Do not treat them as the same surface.

Check your actual UI stack first

  1. Find the embedded App Home entry point and identify whether it uses @shopify/polaris, Polaris Web Components, or custom HTML/CSS.
  2. Inspect the loaded Polaris script. polaris-1.js and the legacy polaris.js URL do not opt into Polaris 2.
  3. Check for duplicated Polaris script tags or a mismatch between a React Router app’s client and server configuration.
  4. Inventory custom cards, banners, badges, sticky controls, and empty states: these do not magically inherit new styles.

Practical implementation: test the 2.0 release candidate

For an embedded App Home that loads the CDN directly, the candidate script is:

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

Load App Bridge before Polaris and load one Polaris bundle. For an app scaffolded with Shopify’s React Router template, use the supported polarisUrl setting in both AppProvider and the server-side shopifyApp configuration. Those values must match; adding an extra script tag is not the fix.

// app/routes/app.tsx
<AppProvider
  apiKey={apiKey}
  polarisUrl="https://cdn.shopify.com/shopifycloud/polaris-2.0-rc.js"
>
  <Outlet />
</AppProvider>

// app/shopify.server.ts — inside shopifyApp({...})
polarisUrl: 'https://cdn.shopify.com/shopifycloud/polaris-2.0-rc.js',

Shopify documents this setup for @shopify/shopify-app-react-router 2.1.0 or newer. If your app still uses Polaris React, migrate one screen or feature at a time to web components; changing a script URL alone will not restyle React components.

Do not overlook fixed controls and Sidekick

The new admin can float Sidekick and other host controls above the bottom of the embedded app. A custom fixed Save bar, sticky footer, or floating action button can end up underneath them. For custom bottom-positioned elements, use Shopify’s safe-area variable:

.app-sticky-actions {
  bottom: var(--shopify-safe-area-inset-bottom, 0px);
}

Also check tables with sticky columns, long inventory grids, modals, and narrow viewports. The host’s changed navigation width can expose layout assumptions that were previously invisible.

Common misunderstanding

“My app uses Polaris, so Shopify will automatically give it the new admin design.” Not necessarily. Extensions pick up the new look automatically. An embedded App Home using Polaris Web Components 1.x stays on the old style until you opt into 2.0; an interface still using Polaris React or custom CSS requires migration work.

How to test this

  • Test the app in a development store with the new admin design feature preview and in a store with the previous admin.
  • Verify the app loads exactly one Polaris bundle and that React Router client/server URLs match.
  • Walk empty, loading, error, and populated states, not only the landing page.
  • Test search, tables, sticky headers, bottom actions, modal windows, and mobile widths.
  • Confirm custom elements and any remaining Polaris React components do not clash visually with web components.
  • Keep a rollback path to the stable polaris-1.js channel while 2.0 is a release candidate.

Timing: Shopify’s September 24, 2026 announcement says Built for Shopify apps have until May 1, 2027 to align their embedded App Home interface with the new admin visual style. That is not a deadline for every custom app to adopt an RC immediately.

Sources and further reading

Keep going

More Shopify Answers

Browse the library