# General Translation React SDKs (gt-react, gt-next, gt-react-native): useSetLocale
URL: https://generaltranslation.com/en-GB/docs/react/reference/hooks/use-set-locale.mdx
---
title: useSetLocale
description: Change the active locale. API reference for useSetLocale.

---

The `useSetLocale` hook returns a function that changes the active locale. It is client-side only.

*Available in `gt-react`, `gt-next`, `gt-tanstack-start`, and `gt-react-native`.*

## Overview [#overview]

Call `useSetLocale` to get the setter, then call it with a locale code.

*Examples import from `gt-react`; import from your framework's package instead.*

```tsx
import { useSetLocale } from 'gt-react';

export default function LocaleButton() {
  const setLocale = useSetLocale();
  return <button onClick={() => setLocale('en')}>Set locale</button>;
}
```

*Note: `useSetLocale` is client-side only.*

## How it works [#how-it-works]

Calling the returned function persists and applies the locale through the active framework:

* React stores it in a cookie and reloads the page by default.
* Next.js App Router stores it in a cookie and refreshes the server component tree. Pages Router can replace the default reload with Next.js navigation.
* TanStack Start stores it in a cookie and reloads the page, or navigates to the corresponding pathname when [`localeRouting`](/docs/react/reference/config#locale-routing) is enabled.
* React Native stores it in native storage, updates provider state, loads translations, and rerenders.

## Returns [#returns]

**Type** `(locale: string) => void`

A function that sets the active locale to the given code.

## Notes [#notes]

* `useSetLocale` is client-side only.
* To read the active locale, use [`useLocale`](/docs/react/reference/hooks/use-locale). For a ready-made switcher, use [`<LocaleSelector>`](/docs/react/reference/components/locale-selector).