• Blog
  • Documentation
  • Courses
  • Changelog
  • AI Starters
  • UI Kit
  • FAQ
  • Supamode
    New
  • Pricing

Launch your next SaaS in record time with Makerkit, a React SaaS Boilerplate for Next.js and Supabase.

Makerkit is a product of Makerkit Pte Ltd (registered in the Republic of Singapore)Company Registration No: 202407149CFor support or inquiries, please contact us

About
  • FAQ
  • Contact
  • Verify your Discord
  • Consultation
  • Open Source
  • Become an Affiliate
Product
  • Documentation
  • Blog
  • Changelog
  • UI Blocks
  • Figma UI Kit
  • AI SaaS Starters
License
  • Activate License
  • Upgrade License
  • Invite Member
Legal
  • Terms of License
    • Tailwind CSS
    • Shadcn UI
    • Themes

Themes | Next.js Firebase SaaS Kit

Learn how to configure the default theme of your Next.js Firebase 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.

On this page
  1. Changing the default theme
    1. Disabling the theme toggle