This documentation is for a legacy version of Next.js and Supabase (Lite). For the latest version, please visit the Next.js and Supabase V2 documentation

Themes

Learn how to configure the default theme of your application.

By default, the Makerkit kits come with a light and a dark theme, and we provide a toggle to let users switch between them.

Changing the default theme

To change the default theme, you need to update the theme in your src/configuration.ts file.

src/configuration.ts
const configuration = {
theme: Themes.Dark,
...
}

Disabling the theme toggle

To disable the theme toggle, you need to update the src/configuration.ts file.

src/configuration.ts
const configuration = {
theme: Themes.Dark,
features: {
enableThemeSwitcher: false,
},
...
}

This will prevent the theme toggle from appearing in the application.