New: Updated organization and app theming

[mckenna]

We’re excited to share that we’ve begun rolling out a new Theming experience to cloud users!

Users on the Business and Enterprise plans can now see a revamped organization-level theme editing experience with expanded functionality, including:

• The ability to create custom color, typography, and metric tokens for use in the theme editor and app component styles.
• The ability to create multiple modes within a theme and switch between modes in an app using theme.setMode().
• The ability to configure default styles for individual components, as well as bulk edit shared styles for multiple components at once.
• Expanded typography controls—including the ability to configure multiple fonts in a theme using a CSS import or Google Fonts, set a default font family, and control font family and font weight for headings.

For users on all plans:

• Component-level font weight and font family style controls.
• A refreshed app-level theme experience with expanded typography controls.
• An updated component style editing experience.

The new theming experience is currently rolling out on Retool Cloud and will be available in the next stable release of Self-hosted Retool.

Check out the docs here!

Questions? Feedback? Please leave any comments in the thread!

[MiguelOrtiz]

This is brilliant, thank you @mckenna!

[ZeroCodez]

@mckenna This new theming experience looks fantastic! Expanded customization and streamlined controls will make a big difference in design consistency and flexibility . Excited to explore these options!

[Almopt]

That's awesome news! @mckenna

I'm looking forward to trying out this new feature and to being able to add dark to ligth mode with a simple switch button.

[jacobstern]

Since we're still building out our documentation and examples library here's a quick recipe for a persistent dark mode toggle! You will need an organization-level theme with "Light" and "Dark" modes first though.