---
title: Customer Account API
description: >-
  Create unique customer experiences with the Customer Account API. The API
  offers a full range of options making it possible for customers to view their
  orders, manage their profile and much more.
    
    You can access the [Customer Account GraphQL API](/docs/api/customer) using the global `fetch()`.
    
    The `API_VERSION` specified in the URL determines which version of the Customer Account API is used.
    
api_version: 2026-04
api_name: customer-account-ui-extensions
source_url:
  html: >-
    https://shopify.dev/docs/api/customer-account-ui-extensions/latest/target-apis/account-apis/customer-account-api
  md: >-
    https://shopify.dev/docs/api/customer-account-ui-extensions/latest/target-apis/account-apis/customer-account-api.md
---

# Customer Account API

Create unique customer experiences with the Customer Account API. The API offers a full range of options making it possible for customers to view their orders, manage their profile and much more.

You can access the [Customer Account GraphQL API](https://shopify.dev/docs/api/customer) using the global `fetch()`.

The `API_VERSION` specified in the URL determines which version of the Customer Account API is used.

### Support Targets (24)

### Supported targets

* customer-account.​footer.​render-after
* customer-account.​order-index.​announcement.​render
* customer-account.​order-index.​block.​render
* customer-account.​order-status.​announcement.​render
* customer-account.​order-status.​block.​render
* customer-account.​order-status.​cart-line-item.​render-after
* customer-account.​order-status.​cart-line-list.​render-after
* customer-account.​order-status.​customer-information.​render-after
* customer-account.​order-status.​fulfillment-details.​render-after
* customer-account.​order-status.​payment-details.​render-after
* customer-account.​order-status.​return-details.​render-after
* customer-account.​order-status.​unfulfilled-items.​render-after
* customer-account.​order.​action.​menu-item.​render
* customer-account.​order.​action.​render
* customer-account.​order.​page.​render
* customer-account.​page.​render
* customer-account.​profile.​addresses.​render-after
* customer-account.​profile.​announcement.​render
* customer-account.​profile.​block.​render
* customer-account.​profile.​company-details.​render-after
* customer-account.​profile.​company-location-addresses.​render-after
* customer-account.​profile.​company-location-payment.​render-after
* customer-account.​profile.​company-location-staff.​render-after
* customer-account.​profile.​payment.​render-after

Examples

### Examples

* #### Extension.jsx

  ##### Default

  ```jsx
  import '@shopify/ui-extensions/preact';
  import {render} from 'preact';
  import {useEffect, useState} from 'preact/hooks';

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

  const API_VERSION = '2026-01';

  function Extension() {
    const [customerName, setCustomerName] =
      useState('');

    const getCustomerNameQuery = {
      query: `query {
        customer {
          firstName
        }
      }`,
    };

    useEffect(() => {
      fetch(
        `shopify://customer-account/api/${API_VERSION}/graphql.json`,
        {
          method: 'POST',
          headers: {
            'Content-Type': 'application/json',
          },
          body: JSON.stringify(
            getCustomerNameQuery,
          ),
        },
      )
        .then((response) => response.json())
        .then(
          ({
            data: {
              customer: {firstName},
            },
          }) => {
            setCustomerName(firstName);
          },
        )
        .catch(console.error);
    });

    return customerName ? (
      <s-banner>
        {shopify.i18n.translate('welcomeMsg', {
          name: customerName,
        })}
      </s-banner>
    ) : null;
  }
  ```

## Related

[Navigate to - GraphQL Customer Account API](https://shopify.dev/docs/api/customer)