Skip to main content

Language toggle

A simple component for switching between two languages

The language toggle component lets the user switch between two languages when using a service.

It is used in the Toggle to Welsh pattern to switch between English and Welsh. This is the main DWP use case.

Open in new tab

When to use this component

Use the language toggle when a service is available in two different languages and the user can switch between them while using the service.

When to consider something else

Do not use this component to switch between more than two languages.

Similar components

The Government of Canada has a similar component which is used for switching between English and French. It displays only the alternate language (not the inactive current language link).

Design goals and metrics

This component was created to separate the technical part of the Toggle to Welsh pattern, so that it could be included in DWP Frontend and also used for other language pairs if needed.

Discuss on GitHub

There is a public discussion for this topic on GitHub where you can share anything you think might be useful. Discuss Language toggle on GitHub.

Get support

Need help implementing this in a prototype or production build? Get support from the Design System team.

Give feedback

We depend on insights from real projects to update and improve the design system. If you use something we made, tell us how it went.


Could we improve this page?

Send questions, comments or suggestions to the DWP Design System team.

Last updated: