NNexusDocumentation
Live demo
GuideCustomize

Branding & Product Identity

Replace the Nexus identity with your product name, metadata, logos, icons, and branded copy.

9 min readCustomizeUpdated for Nexus 0.1
On this page 5

What you will learn

  • Replace visible product identity.
  • Update browser and social metadata.
  • Audit remaining demo brand copy.

Update application metadata

Edit the metadata export in app/layout.tsx. Use a default title, title template, and description that describe your own product.

tsx
export const metadata: Metadata = {
  title: {
    default: "Your Product",
    template: "%s | Your Product"
  },
  description: "Your product description"
};

Replace shell branding

The sidebar and mobile navigation brand are rendered by components/app-shell.tsx. Replace the label and brand mark while preserving accessible text and compact-sidebar behavior.

  • Full logo remains readable on desktop.
  • Compact logo remains recognizable when the sidebar collapses.
  • Mobile menu header fits at 320px width.
  • Logo has meaningful alternative text when rendered as an image.

Replace static assets

Place product-owned assets under public using stable, descriptive names. Update every reference before removing old assets.

text
public/brand/logo.svg
public/brand/logo-mark.svg
public/brand/favicon.ico
public/brand/social-card.png

Audit visible copy

Search source files for the old product name, demo company names, placeholder email addresses, and sample legal text.

bash
rg -ni "azora|nexus|demo|example.com" app components lib public --glob '!public/nexus-ui/**'

Continue learning