Supported themes

For some time now, browsers have supported an automatic switch between dark and light theme. This switch is based on the theme setting in your operating system. There might be situations where you want to force a light or dark theme. For that purpose, Cosmo supports a forced theme. Check below to see which classes you need to apply.

Force a theme

To force the light theme, apply the is--light to the HTML tag of your document. On the other hand, you need to apply the is--dark class to the HTML tag to force the dark theme.

Toggle theme

Apply theme only to dialogs

It is also possible to force a theme on modal dialogs, by applying the theme to the dialog container. See below for an example.