---
title: useSelectedOptionInUrlParam
description: Sets the url params to the selected option.
api_version: 2026-04
source_url:
  html: >-
    https://shopify.dev/docs/api/hydrogen/latest/utilities/useselectedoptioninurlparam
  md: >-
    https://shopify.dev/docs/api/hydrogen/latest/utilities/useselectedoptioninurlparam.md
api_name: hydrogen
---

# useSelectedOptionInUrlParam

Sets the url params to the selected option.

Examples

### Examples

* ####

  ##### useSelectedOptionInUrlParam example

  ```js
  import {useSelectedOptionInUrlParam} from '@shopify/hydrogen';

  const selectedOption = [
    {
      name: 'Color',
      value: 'Red',
    },
    {
      name: 'Size',
      value: 'Medium',
    },
  ];

  useSelectedOptionInUrlParam(selectedOption);

  // URL will be updated to <original product url>?Color=Red&Size=Medium
  ```

***

## Related

[- getProductOptions](https://shopify.dev/docs/api/hydrogen/2026-04/utilities/getproductoptions)

[- getAdjacentAndFirstAvailableVariants](https://shopify.dev/docs/api/hydrogen/2026-04/utilities/getadjacentandfirstavailablevariants)

***