---
title: Internationalization in CMP
description: Learn how to set up basic internationalization using field-level translation within your Compose Multiplatform project.
url: https://www.storyblok.com/docs/quickstarts/compose-multiplatform/internationalization
---

# Internationalization in CMP

Learn how to create a basic implementation of field-level translation in a Compose Multiplatform (CMP) project.

## Setup

In your space, open **Settings** → **Internationalization** → **Languages** and add `es` (Spanish).

-   In the article content type block schema, set the `title` and `content` fields as translatable.
-   Open each article, select the Spanish language, and provide translated content. You can also use [AI Translations](https://www.storyblok.com/docs/manuals/ai-assistance).

> [!NOTE]
> Learn more in the [internationalization concept](/docs/concepts/internationalization).

## Use the device locale

Update `App.kt` to determine the language from the device locale.

shared/src/commonMain/kotlin/org/example/project/App.kt

```kotlin
…
import androidx.navigation3.runtime.entryProvider
import androidx.compose.ui.text.intl.LocaleList
…
      val backStack = rememberNavBackStack(NavConfiguration, initialStoryKey)

      val availableLanguages = listOf("es")
      val language = LocaleList.current.localeList
        .map { it.language }
        .firstOrNull { it in availableLanguages }

      Storyblok(
        accessToken = "YOUR_ACCESS_TOKEN",
        version = contentVersion,
        region = EU, // Choose the correct region from your Space.
        language = language,
        …
      ) {
        …
      }
…
```

First, `availableLanguages` lists the language codes configured in the space.

Next, [`LocaleList.current`](https://developer.android.com/reference/kotlin/androidx/compose/ui/text/intl/LocaleList) returns the user’s preferred locales in priority order. The first locale whose language is in `availableLanguages` becomes the `language` parameter of the [`Storyblok`](https://storyblok.github.io/storyblok-kotlin/storyblok-compose/com.storyblok.compose/-storyblok.html) composable function. If no locale matches, `language` stays `null` and the API returns the space’s default language.

> [!NOTE]
> `LocaleList` is part of Compose’s multiplatform text API, so this same code works on Android, iOS, and web—unlike `LocalConfiguration`, which exists only on Android.

> [!TIP]
> Use the `fallbackLanguage` parameter of the [`Storyblok`](https://storyblok.github.io/storyblok-kotlin/storyblok-compose/com.storyblok.compose/-storyblok.html) composable function to specify which language to fall back to for fields that have not been translated yet.

## Test on each target

Each target changes the language differently:

-   **Android**: change the device language under **Settings** → **System** → **Languages**, or set a per-app language preference. The configuration change recreates the composition and the stories are re-fetched automatically.
-   **iOS**: change the language in **Settings** → **General** → **Language & Region**, or set a per-scheme language in Xcode. The app restarts.
-   **Web**: change the language in the browser settings, then reload the page.

The app now renders the translated article content.

> [!NOTE]
> Internationalization is highly implementation-specific. Instead of relying on the device locale, you may, for example, want to offer an in-app language picker and store the selection, passing it as the `language` parameter. That approach also behaves consistently across all three targets.

## Related resources

[Concept: Internationalization](/docs/concepts/internationalization)

[Storyblok Composable Function Reference](https://storyblok.github.io/storyblok-kotlin/storyblok-compose/com.storyblok.compose/-storyblok.html)

[Kotlin: Localize Strings in Compose Multiplatform](https://kotlinlang.org/docs/multiplatform/compose-localize-strings.html)

## Pagination

-   [Previous: Content Modeling in CMP](/docs/quickstarts/compose-multiplatform/content-modeling)
-   [Next: Integrate iOS with Storyblok](/docs/quickstarts/apple-platforms)
