This documentation is for a legacy version of Next.js Supabase. For the latest version, please visit the Next.js Supabase Turbo 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.


Subscribe to our Newsletter
Get the latest updates about React, Remix, Next.js, Firebase, Supabase and Tailwind CSS