# Customize styles for a locale

You can apply styles to a specific locale by using a `:root` selector in the `@themes/styles.css` file.
This can be useful if you want to customize how certain UI elements look or change the font for a certain locale.

## Before you begin

Make sure you have the following:

- A Redocly project with a `l10n` folder containing your translated content organized into locales.
See [l10n configuration](/docs/realm/config/l10n) and [Add translated content](/docs/realm/content/localization/localize-content) for more information.
- A `@theme/styles.css` file in your project.
See [custom styles](/docs/realm/branding/customize-styles) for more information.


## Add custom styles for a locale

To add styles that would only apply to a specific locale, you can use the `:root` element selector combined with a `lang` attribute selector in the `@theme/styles.css` file.
The `lang` attribute value should match the locale code from `redocly.yaml`.

For example, to add styles that would only apply to the Spanish locale, you can use the following:


```yaml redocly.yaml
l10n:
  defaultLocale: en-US
  locales:
    - code: en-US
      name: English
    - code: es-ES
      name: Spanish
```


```css @theme/styles.css
:root[lang="es-ES"] {
  /* styles for the Spanish locale */
}
```

## Resources

- **[Localization configuration](/docs/realm/config/l10n)** - Configure language support, default locales, and localization behavior for your multi-language project
- **[Localize content files](/docs/realm/content/localization/localize-content)** - Translate your documentation content into multiple languages with proper file organization and structure
- **[Custom styles guide](/docs/realm/branding/customize-styles)** - Learn to customize your project's appearance using CSS variables and locale-specific styling techniques