Branding

The admin.branding key in nextly.config.ts controls the visual identity of your admin panel. You can replace the default Nextly logo, set custom brand colors, add a favicon, and control whether the Schema Builder section is visible.

Full Example

import { defineConfig } from '@nextlyhq/nextly';

export default defineConfig({
  admin: {
    branding: {
      logoUrl: '/logo.svg',
      logoUrlLight: '/logo-light.svg',
      logoUrlDark: '/logo-dark.svg',
      logoText: 'My App',
      favicon: '/favicon.ico',
      colors: {
        primary: '#6366f1',
        accent: '#f59e0b',
      },
      showBuilder: true,
    },
  },
});

Logo Configuration

You can provide a single logo or separate logos for light and dark modes.

When logoUrl is set, it takes priority over the light/dark variants. When neither logoUrl nor the light/dark variants are set, the sidebar displays logoText as plain text.

// Single logo for both modes
admin: {
  branding: {
    logoUrl: '/logo.svg',
    logoText: 'Acme CMS',
  },
}

// Separate logos for light and dark modes
admin: {
  branding: {
    logoUrlLight: '/logo-light.svg',
    logoUrlDark: '/logo-dark.svg',
    logoText: 'Acme CMS',
  },
}

Color Scheme

The colors object accepts 6-digit hex values. Foreground colors for text and icons are calculated automatically to meet WCAG AA contrast requirements.

admin: {
  branding: {
    colors: {
      primary: '#6366f1',   // Indigo
      accent: '#f59e0b',    // Amber
    },
  },
}

The colors are converted to HSL on the server and injected as CSS custom properties into the admin panel, so the change is applied globally without any client-side JavaScript overhead.

Favicon

Set a custom favicon for the admin panel browser tab.

admin: {
  branding: {
    favicon: '/favicon.ico',
  },
}

The path can be absolute or relative to your Next.js public folder. Common formats: .ico, .png, .svg.

Schema Builder Visibility

The showBuilder option controls whether the Schema Builder section (Collections Builder, Singles Builder, Components Builder) appears in the admin sidebar.

// Always show the Schema Builder, even in production
admin: {
  branding: {
    showBuilder: true,
  },
}

// Always hide the Schema Builder, even in development
admin: {
  branding: {
    showBuilder: false,
  },
}

This is evaluated at runtime via the /api/admin-meta response. Users still need the manage-settings permission to access Schema Builder pages regardless of this toggle.

Branding Options Reference

Next Steps

• Customization -- Plugin overrides and sidebar configuration
• Admin Panel Overview -- Full navigation and feature guide
• Schema Builder -- What the Schema Builder does and how to use it