---
title: Migrate to the Polaris heading component
description: >-
  Learn how to migrate the Heading component to Polaris web components in
  checkout and customer account UI extensions.
source_url:
  html: >-
    https://shopify.dev/docs/apps/build/checkout/migrate-to-web-components/heading
  md: >-
    https://shopify.dev/docs/apps/build/checkout/migrate-to-web-components/heading.md
---

# Migrate to the Polaris heading component

The Polaris heading component renders section titles with automatic hierarchy based on nesting. It replaces the previous [`Heading`](https://shopify.dev/docs/api/checkout-ui-extensions/2025-07/ui-components/typography-and-content/heading) component and is available as [`<s-heading>`](https://shopify.dev/docs/api/checkout-ui-extensions/latest/web-components/typography-and-content/heading) in API versions 2025-10 and newer.

***

## Removed properties

### level

The Polaris heading component no longer supports `level`. Heading levels are determined automatically based on nesting within [`<s-section>`](https://shopify.dev/docs/api/checkout-ui-extensions/latest/web-components/layout-and-structure/section) components.

## Migrating level to section nesting

##### Latest (Preact)

```tsx
import '@shopify/ui-extensions/preact';
import {render} from 'preact';

export default function extension() {
  render(<Extension />, document.body);
}

function Extension() {
  return (
    <>
      <s-heading>Order Summary</s-heading>
      <s-section>
        <s-heading>Shipping Details</s-heading>
      </s-section>
    </>
  );
}
```

##### Pre-Polaris (2025-07)

```tsx
import {
  reactExtension,
  Heading,
} from '@shopify/ui-extensions-react/checkout';

export default reactExtension(
  'purchase.checkout.block.render',
  () => <Extension />,
);

function Extension() {
  return (
    <>
      <Heading level={2}>Order Summary</Heading>
      <Heading level={3}>Shipping Details</Heading>
    </>
  );
}
```

### inline​Alignment

The Polaris heading component no longer supports `inlineAlignment`. There's no direct replacement for this property.

***