Nexa — Design Token Editor

Colors

Logo & Favicon

Logo is previewed in the component preview panel. Favicon updates the browser tab live. To make these permanent, replace public/logo.* and public/favicon.ico in the repo.

Export CSS

Copy the block below and paste it into src/app/globals.css to make your changes permanent.

@layer base {
  :root {
    --primary: #1b2d6b;
    --primary-foreground: #ffffff;
    --accent: #c4962a;
    --accent-foreground: #111b45;
    --secondary: #eef1f9;
    --secondary-foreground: #1b2d6b;
    --background: #ffffff;
    --foreground: #0f1640;
    --card: #ffffff;
    --card-foreground: #0f1640;
    --muted: #f5f7ff;
    --muted-foreground: #6b7280;
    --border: #e2e8f0;
    --input: #e2e8f0;
    --ring: #1e2b83;
    --destructive: #ef4444;
  }
}