Configuration

NextSaas is designed to be easily customizable. You can change your site's branding, SEO metadata, visual theme, feature flags, and analytics without diving deep into complex code.

Site Config

The main configuration file is located at src/config/website.ts. This file controls the global metadata used across your site and emails.

export const websiteConfig: WebsiteConfig = {
  name: "NextSaas", // Your product name
  description: "Build your SaaS product faster...", // Default site description
  url: env.NEXT_PUBLIC_HOST, // Auto-configured from env
  author: {
    name: "Bonjour", // Your company/author name
    email: "support@nextsaas.dev", // Support email
  },
  links: {
    github: "https://github.com/...", // Social links
    twitter: "https://twitter.com/...",
    // ...
  },
  seo: {
    // Default SEO configuration
    title: "NextSaas - Production-Ready SaaS Template",
    // ...
  },
};

Update these values to match your product's identity.

Theming

NextSaas uses Tailwind CSS 4 for styling. The theme colors and fonts are defined as CSS variables in src/styles/globals.css.

Colors

You can customize the color palette by modifying the CSS variables under the :root (light mode) and .dark (dark mode) selectors.

:root {
  /* Primary Brand Color */
  --primary: oklch(0.5553 0.1455 48.9975);
  --primary-foreground: oklch(1 0 0);

  /* ... other variables */
}

We use OKLCH color space for better perceptual uniformity. You can use tools like oklch.com to generate your palette.

Fonts

To change the font, first import your desired font in src/app/layout.tsx using next/font/google, then update the variable mapping in globals.css.

@theme inline {
  --font-sans:
    /* Your Font Variable */ var(--font-sans), ui-sans-serif, system-ui, ...;
}

Feature Flags

NextSaas includes a feature flag system that lets you enable or disable features via environment variables. The flags are defined in src/lib/features.ts.

When a feature is disabled, the corresponding UI elements (buttons, pages, settings) are hidden automatically.

Analytics

NextSaas supports two analytics providers out of the box. Both are optional — simply set the environment variables to enable them.

Google Analytics

NEXT_PUBLIC_GA_ID="G-XXXXXXXXXX"

Umami

Umami is a privacy-friendly, open-source analytics alternative.

NEXT_PUBLIC_UMAMI_SRC="https://your-umami-instance.com/script.js"
NEXT_PUBLIC_UMAMI_WEBSITE_ID="your-website-id"

[!TIP] You can use both analytics providers simultaneously — they operate independently.

SEO Optimized

NextSaas comes with built-in SEO best practices.

• Metadata: Automatically generated from websiteConfig.
• Sitemap: Generated at /sitemap.xml.
• Robots: Generated at /robots.txt.
• Open Graph: Dynamic OG images are supported.
• JSON-LD: Structured data for search engines.

You can further customize SEO behavior per page using Next.js Metadata API.