Customise your theme

Every Astromade theme keeps buyer-facing settings in src/config.ts. That is the first file to open.

Identity and navigation

src/config.ts exports a single object with site name, description, owner, navigation links, and social handles. Replace placeholder values, save, and the dev server reflects them on reload.

export const site = {
  name: "Your studio",
  url: "https://yourstudio.com",
  owner: "Your name",
  nav: [
    { href: "/work", label: "Work" },
    { href: "/about", label: "About" },
    { href: "/contact", label: "Contact" },
  ],
  social: [
    { href: "https://x.com/your-handle", label: "X" },
    { href: "mailto:hello@yourstudio.com", label: "Email" },
  ],
};

Leave href as # until a real link is ready. Themes treat # as a placeholder and skip it from sitemaps where appropriate.

Palette and tokens

Colour, spacing, and typography tokens live in src/styles/global.css under the @theme block. Tailwind v4 reads them at build time, so changing one value updates every component that uses it.

@theme {
  --color-bg: oklch(0.98 0.01 80);
  --color-fg: oklch(0.18 0.01 80);
  --color-accent: oklch(0.62 0.18 30);
  --color-line: oklch(0.92 0.01 80);
  --font-sans: "Suisse Int'l", ui-sans-serif, system-ui, sans-serif;
}

Stay inside the same naming pattern. Components reference tokens by name, not by hex.

Fonts

Themes ship libre fonts only, self-hosted under public/fonts/. To swap a font, drop the new woff2 files into the same folder, update @font-face rules in src/styles/global.css, and rerun the dev server. Keep weights to what the theme actually uses to avoid bloating the page weight.

Light and dark

If the theme has a toggle, dark mode tokens sit beside the light ones in the same @theme block, scoped under a [data-theme="dark"] selector. Avoid duplicating values across both modes. Pick semantic tokens like --color-fg rather than literal --white.

What not to touch

Until you are confident, leave the build pipeline alone. The Vercel adapter, MDX integration, and motion helpers are wired correctly out of the box.