Example Docs

Fonts

Customize the typography of your documentation with custom fonts.

Font Configuration

theme: greentree({
  ui: {
    typography: {
      font: {
        style: {
          sans: "Inter, system-ui, sans-serif",
          mono: "JetBrains Mono, monospace",
        },
        h1: { size: "2.25rem", weight: 700, letterSpacing: "-0.025em" },
        h2: { size: "1.5rem", weight: 600 },
        body: { size: "0.975rem", lineHeight: "1.8" },
      },
    },
  },
});

Using Google Fonts

Install and configure fonts in your layout.tsx:

import { Inter, JetBrains_Mono } from "next/font/google";

const inter = Inter({ subsets: ["latin"] });
const jetbrains = JetBrains_Mono({ subsets: ["latin"] });

Font Size Scale

ElementDefault SizeWeight
h12.25rem700
h21.5rem600
h31.25rem600
body0.975rem400
small0.875rem400