---
title: useCartLine
description: >-
  The useCartLine hook provides access to the CartLine object from the
  Storefront API.
api_version: 2026-04
source_url:
  html: 'https://shopify.dev/docs/api/hydrogen-react/latest/hooks/usecartline'
  md: 'https://shopify.dev/docs/api/hydrogen-react/latest/hooks/usecartline.md'
api_name: hydrogen-react
---

# use​Cart​Line

The `useCartLine` hook provides access to the [CartLine object](https://shopify.dev/api/storefront/unstable/objects/cartline) from the Storefront API. It must be a descendent of a `CartProvider` component.

## use​Cart​Line()

The `useCartLine` hook provides access to the [CartLine object](https://shopify.dev/api/storefront/2026-04/objects/cartline) from the Storefront API. It must be a descendent of a `CartProvider` component.

### Returns

* **CartLinePartialDeep**

### CartLinePartialDeep

```ts
PartialDeep<
  CartLine | ComponentizableCartLine,
  {recurseIntoArrays: true}
>
```

Examples

### Examples

* #### Example code

  ##### Description

  I am the default example

  ##### JavaScript

  ```jsx
  import {CartLineProvider, useCartLine} from '@shopify/hydrogen-react';

  export function CartWrapper({cart}) {
    const firstCartLine = cart.lines.nodes[0];
    return (
      <CartLineProvider line={firstCartLine}>
        <CartLineQuantity />
      </CartLineProvider>
    );
  }

  function CartLineQuantity() {
    const cartLine = useCartLine();

    return <div>{cartLine.quantity}</div>;
  }
  ```

  ##### TypeScript

  ```tsx
  import {CartLineProvider, useCartLine} from '@shopify/hydrogen-react';
  import type {Cart} from '@shopify/hydrogen-react/storefront-api-types';

  export function CartWrapper({cart}: {cart: Cart}) {
    const firstCartLine = cart.lines.nodes[0];
    return (
      <CartLineProvider line={firstCartLine}>
        <CartLineQuantity />
      </CartLineProvider>
    );
  }

  function CartLineQuantity() {
    const cartLine = useCartLine();

    return <div>{cartLine.quantity}</div>;
  }
  ```

***

## Related

[CartLineProvider](https://shopify.dev/docs/api/hydrogen-react/2026-04/components/cart/cartlineprovider)

***
