# Localization

Use English and German dictionaries and customize visible copy.

Source: https://docs.peax.co/consent/guides/localization



## Select a locale [#select-a-locale]

```tsx
<Banner isOpen locale="de-AT" bannerContent={{ acceptAllLabel: 'Zustimmen' }} />
```

Locale resolution trims whitespace, ignores case and falls back from a regional tag to its base language. `en-GB` resolves to English, `de-AT` to German; unsupported or empty inputs use English.

Selection is explicit. Use the same locale for SSR and hydration. There is no browser language detection or storage access.

## Override only what changes [#override-only-what-changes]

`bannerContent` accepts partial banner and preferences messages. `preferencesContent` changes per-section titles and descriptions. Omitted fields retain translated defaults.

```tsx
<Banner
  isOpen
  locale="de"
  preferencesContent={{ essential: { title: 'Notwendige Cookies' } }}
/>
```

## Policy links [#policy-links]

Translations may contain a flat `<cookiePolicy>label</cookiePolicy>` placeholder. Your application supplies the destination through `cookiePolicyUrl`:

```tsx
<Banner
  isOpen
  cookiePolicyUrl="/cookies"
  bannerContent={{ collapsedText: 'Read our <cookiePolicy>Cookie Policy</cookiePolicy>.' }}
/>
```

The renderer creates a link for a usable destination, otherwise plain text. It does not inject arbitrary HTML. Unknown or malformed markup remains literal text.

## Direct dictionaries [#direct-dictionaries]

Import from `@peax/consent-banner-locales/en` or `/de` when you need one language directly. Install locales as a direct dependency when importing it in application code. Spread dictionaries to customize them; do not mutate shared defaults.

See [locale exports](/consent/reference/locales).
