Next.js i18n that works with the App Router

Next.js i18n that works with the App Router

Open-source localization library and platform for Next.js

Open-source localization library and platform for Next.js

Translations render on the server, so there is no flash of untranslated text. A T component and a hook on the client, a translate function in server components, ICU plurals and TypeScript types. Keys sync to Tolgee as you write them. And once it is wired, texts stop being your tickets.

Translations render on the server, so there is no flash of untranslated text. A T component and a hook on the client, a translate function in server components, ICU plurals and TypeScript types. Keys sync to Tolgee as you write them. And once it is wired, texts stop being your tickets.

Sign up for free

No card required.
500 keys and 3 seats
on the free plan.

Read the Next.js docs

// app/page.tsx

<h1>Sign up</h1>

Tolgee project

app_title

cta_button

// app/page.tsx

<h1>{t(‘signup_title’)}</h1>

Tolgee project

app_title

cta_button

signup_title

Sign up

Registrieren

Regístrate

4.6

Star

Trusted by great companies. Used by 40 000+ users.

Up and running in three lines

Install the SDK, wrap a string, run the app. New keys show up in your Tolgee project on their own. Works in server components and client components.

Full Next.js guide in the docs

> npm install @tolgee/react

What you get as a developer

App Router and server components

Translate in server components with a translate function, in client components with the T component or the hook. Both from the same SDK.

No flash of untranslated text

Translations are loaded on the server and passed to the client. The first paint is already translated.

Locale routing your way

Works with your existing locale strategy, whether it is a path segment, a cookie or a header. Tolgee does not take over your routing.

ICU plurals and placeholders

Plurals, gender, numbers and dates through ICU message format. HTML in translations is handled safely.

Same SDK as React

It is the same @tolgee/react package, so anything from a plain React app carries over. Plain React? There is a dedicated page for that.

CLI, API and standard formats

Push and pull translations in CI, import and export JSON, .po, XLIFF and more. Your data is never locked in.

Alt+click any text in your running app and edit it

QuickFit app

Workouts that fit your schedule, goals, and lifestyle.

Workouts that fit your schedule, goals, and lifestyle.

Quick translation

Homepage-subtitle

Workouts that fit your schedule, goals...

Entrenamientos que se adaptan a tu…

Alt+click any text in your running app and edit it

Hold Alt, click any text in the running app, type. That is the whole editing flow.

Hold Alt, click any text in the running app, type. That is the whole editing flow.

Your PM, your client or your translator can do it. They edit in the app, not in a spreadsheet.

Your PM, your client or your translator can do it. They edit in the app, not in a spreadsheet.

The edit is data in Tolgee, not a change in your code. Nothing ships until you decide.

The edit is data in Tolgee, not a change in your code. Nothing ships until you decide.

Sign up for free
Sign up for free

Nico H.

Project Leader

I really like the in-context editing feature of Tolgee. This way our clients have an easy to use way to edit translations of the platforms we build.

See review

Nico H.

Developer

I really like the in-context editing feature of Tolgee. This way our clients have an easy to use way to edit translations of the platforms we build.

See review

AI translations that know where the string sits

AI translations that know where the string sits

The SDK captures the context of each text in your UI.

The SDK captures the context of each text in your UI.

The AI translator uses it, so "Save" on a button and "Save" in a bank app do not get the same translation. New languages are ready in minutes.

The AI translator uses it, so "Save" on a button and "Save" in a bank app do not get the same translation. New languages are ready in minutes.

My app

Learn more

Start now

Quick translation

Button_key_name

Start now

My app

Learn more

Start now

Open source, self-hostable, no lock-in

Apache-2.0 licence, 4 000+ stars on GitHub. Run it on our cloud or on your own servers. Import and export any time.

Star

View on GitHub
View on GitHub

Drew Hoover

Product Developer at Curipod

We were seeing hundreds of React crashes per day from browser translation. Tolgee brought that number to zero overnight.

Read the case study

Drew Hoover

Product Developer at Curipod

We were seeing hundreds of React crashes per day from browser translation. Tolgee brought that number to zero overnight.

Read the case study

Try it on your next Next.js project

Not sure it fits your setup? Write to info@tolgee.io or book a call.

Sign up for free

Marketa Cizmar

Co-founder & COO

Book a demo

Privacy policy

Terms & conditions

Cookie statement

Information security policy

EE licence