# General Translation React SDKs (gt-react, gt-next): useGT URL: https://generaltranslation.com/en-GB/docs/react/reference/hooks/use-gt.mdx --- title: useGT description: Get a function to translate strings inline with General Translation gt-react. API reference for useGT. --- The `useGT` hook returns a function that translates strings into the active locale. Use it for labels, placeholders, and other standalone strings where [``](/docs/react/reference/components/t) does not fit. *Available in `gt-react`, `gt-next`, `gt-tanstack-start`, and `gt-react-native`. Examples import from `gt-react`; import from your framework's package instead.* ## Overview [#overview] Call `useGT` to get the translation function, then pass it a string. The function is returned directly. ```tsx const gt = useGT();

{gt('This text will be translated')}

; ``` *Note: In `gt-react`, call `useGT` inside a [``](/docs/react/reference/components/gt-provider). In `gt-next`, it also works in synchronous server components. Write `const gt = useGT()` — the hook returns the function directly, not an object.* ## How it works [#how-it-works] * **Build-time translation.** In production, strings passed to `gt` are translated during the build, before deployment. Only content known at build time can be translated. Missing translations fall back to the original string. * **On-demand in development.** With a development API key, `gt` translates on demand so you can preview locales, with a slight delay that does not occur in production. * **Variables are not translated.** Interpolated values are inserted into the translated string, but are never translated themselves. ## Parameters [#parameters] `useGT` takes no parameters. ## Returns [#returns] **Type** `(content: string, options?: InlineTranslationOptions) => string` A function that translates the provided string into the active locale. | Name | Description | Type | Optional | | --------- | ------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------ | -------- | | `content` | The string content to translate. | `string` | No | | `options` | Interpolation variables and options such as `$context`, `$id`, and `$maxChars`. | [`InlineTranslationOptions`](/docs/react/reference/types/inline-translation-options) | Yes | ## Examples [#examples] ```tsx import { useGT } from 'gt-react'; export default function TranslateGreeting() { const gt = useGT(); return

{gt('Hello, Alice!')}

; } // "Hello, Alice!" is translated to the user's locale. ``` ```tsx import { useGT } from 'gt-react'; export default function TranslateGreeting() { const gt = useGT(); return

{gt('Hello, {name}!', { name: 'Alice' })}

; } // "Alice" is a variable and is not translated. ``` ```tsx import { useGT } from 'gt-react'; export default function ItemCount() { const gt = useGT(); return (

{gt( 'There are {count, plural, =0 {no items} =1 {one item} other {{count} items}} in the cart', { count: 10 } )}

); } ``` `gt-react` supports [ICU message format](https://unicode-org.github.io/icu/userguide/format_parse/messages/) for formatting variables. ## Notes [#notes] * `useGT` translates strings; translations happen at build time (or on demand in development). * In an async App Router component, use [`getGT`](/docs/react/nextjs/reference/functions/get-gt) instead. * For dictionary-based lookups by id, use [`useTranslations`](/docs/react/reference/hooks/use-translations); to register strings at module scope, use [`msg`](/docs/react/reference/functions/msg) with [`useMessages`](/docs/react/reference/hooks/use-messages).