Inline extensions are any [static extensions](/docs/api/checkout-ui-extensions/latest/extension-targets-overview#static-extension-targets) or [block extensions](/docs/api/customer-account-ui-extensions/extension-targets-overview#block-extension-targets) that add UI to a customer accounts page, such as **Order index**, **Order status**, or **Profile**.

## How it works

On each customer account page, there are static and block extension targets available in designated areas. Static extension targets only render in one designated location, while block extensions offer merchants the flexibility to place the extension in a multiple designated locations on the page.

In the following example, the **Order status** page contains two extensions. The banner at the top of the page is populating the extension target [`customer-account.order-status.block.render`](/docs/api/customer-account-ui-extensions/latest/targets/block/customer-account-order-status-block-render). Block extensions are flexible and merchants can move them to any of the supported locations on the page. The “Write a review” feature below the order status is populating the extension target [`customer-account.order-status.fulfillment-details.render-after`](/docs/api/customer-account-ui-extensions/latest/targets/block/customer-account-order-status-fulfillment-details-render-after). Static extensions are fixed, and merchants cannot move them to another location.

![The Order status page with a banner at the top of the page that says “You’ve earned 1,000 points from this order. You’ve been upgraded to Platinum tier. View rewards”. Under the Delivered status, there’s also a message that says “Tell us how we did for a chance to win 1,000 points” with a button that says “Write a review”.](/assets/apps/customer-accounts/inline-extensions/inline-extensions.png)

## Developer tools and resources

<div class="resource-card-grid">
  <div>
  <a class="resource-card" href="/docs/api/customer-account-ui-extensions/extension-targets-overview" data-theme-mode="">
    <div class="resource-card__indicator-container"><img
     src="/assets/resource-cards/library"
     data-alt-src="/assets/resource-cards/library-dark"
     aria-hidden="true"
     class="resource-card__icon themed-image"></div>
    <h3 class="resource-card__title">
      Target overview
    </h3>
    <p class="resource-card__description">Explore all extension targets available for customer account UI extensions.</p>
  </a>
</div></p>

<p><div>
  <a class="resource-card" href="/docs/api/checkout-ui-extensions/latest/components" data-theme-mode="">
    <div class="resource-card__indicator-container"><img
     src="/assets/resource-cards/blocks"
     data-alt-src="/assets/resource-cards/blocks-dark"
     aria-hidden="true"
     class="resource-card__icon themed-image"></div>
    <h3 class="resource-card__title">
      Checkout UI extension components
    </h3>
    <p class="resource-card__description">Explore the checkout components you can also use to  build customer account UI extensions.</p>
  </a>
</div></p>

<p><div>
  <a class="resource-card" href="/docs/api/customer-account-ui-extensions/components" data-theme-mode="">
    <div class="resource-card__indicator-container"><img
     src="/assets/resource-cards/blocks"
     data-alt-src="/assets/resource-cards/blocks-dark"
     aria-hidden="true"
     class="resource-card__icon themed-image"></div>
    <h3 class="resource-card__title">
      Customer account UI extension components
    </h3>
    <p class="resource-card__description">Explore the components you can use to build customer account UI extensions.</p>
  </a>
</div></p>

<p><div>
  <a class="resource-card" href="https://www.figma.com/community/file/1304881365343613949/checkout-and-account-components" data-theme-mode="">
    <div class="resource-card__indicator-container"><img
     src="/assets/resource-cards/hearts"
     data-alt-src="/assets/resource-cards/hearts-dark"
     aria-hidden="true"
     class="resource-card__icon themed-image"></div>
    <h3 class="resource-card__title">
      Figma UI kit
    </h3>
    <p class="resource-card__description">Figma components for checkout and account UI extensions.</p>
  </a>
</div></p>

<p><div>
  <a class="resource-card" href="https://www.figma.com/community/file/1304882873974540289/account-screens" data-theme-mode="">
    <div class="resource-card__indicator-container"><img
     src="/assets/resource-cards/resource"
     data-alt-src="/assets/resource-cards/resource-dark"
     aria-hidden="true"
     class="resource-card__icon themed-image"></div>
    <h3 class="resource-card__title">
      Figma: Account screens
    </h3>
    <p class="resource-card__description">Figma screens with extension targets, breakpoints, and example designs.</p>
  </a>
</div>
</div>


## Next steps

<div class="resource-card-grid">
  <div>
  <a class="resource-card" href="/docs/apps/build/customer-accounts/inline-extensions/build-order-status" data-theme-mode="">
    <div class="resource-card__indicator-container"><img
     src="/assets/resource-cards/growth"
     data-alt-src="/assets/resource-cards/growth-dark"
     aria-hidden="true"
     class="resource-card__icon themed-image"></div>
    <h3 class="resource-card__title">
      Build inline extensions
    </h3>
    <p class="resource-card__description">Build extensions on the Order Status page that enable customers to see their loyalty points and write a review.</p>
  </a>
</div>
</div>