DEV Community

Cover image for LiveCodes Gets a Fresh Look, and Goes Multilingual!
Hatem Hosny for LiveCodes

Posted on

LiveCodes Gets a Fresh Look, and Goes Multilingual!

LiveCodes recent release provides a major update to the UI. The new UI is more modern, cleaner, more accessible and allows customization with custom theme colors.

In addition, LiveCodes now supports multiple languages. It already supports 90+ programming languages. But we are adding spoken languages this time! With the new internationalization (i18n) support, the UI now can be displayed in 12 different languages.

The New UI

The UI is now cleaner, more consistent and more accessible.

LiveCodes new UI

In addition, the UI theme is now custommizable with custom colors. The theme color can be selected from the UI (Settings menu -> Color).

LiveCodes themes

The color applies to dark and light themes.

LiveCodes themes

LiveCodes themes

The theme color can also be selected as the configuration option themeColor. This allows setting the color using the SDK (for embedded playgrounds) or query params.

Example: https://livecodes.io/?themeColor=lightblue

The UI is responsive and can be used in different screen sizes.

Responsive UI

Multilingual Support (i18n)

The UI can now be displayed in 12 different languages: English (default), Arabic, Chinese, French, German, Hindi, Italian, Japanese, Portuguese, Russian, Spanish and Urdu.

The language is auto-detected based on the user's browser language. In addition, the language can be selected from the UI (i18n menu).

i18n support

i18n support

Moreover, the UI language can also be set using the configuration option appLanguage.

Example: https://livecodes.io/?appLanguage=fr

Credits

A huge shout-out to the wonderful contributors who helped make this release possible by working for months to provide high quality work. Very special thanks to:

Contributions are always welcome. Check out the contribution guide for more details.

What's next?

We have been busy the past few months working on the UI and setting up the infra-structure for more features to come. Now expect more features to be rolling out more frequently.

Stay tuned!

You can stay updated by following us on X/Twitter and GitHub.

Top comments (0)