Quartz

Quartz is an open-source static site generator designed to turn a collection of Markdown notes (e.g. an Obsidian vault) into a fully-featured, interactive website. It features a graph view, full-text search, backlinks, and wikilink support out of the box.

Setup

npx quartz create          # scaffold a new Quartz project
npx quartz sync --commit   # sync content and commit
npx quartz build           # build static output into ./public
npx quartz build --serve   # build and start local dev server

Configuration

All site settings live in quartz.config.ts:

const config: QuartzConfig = {
  configuration: {
    pageTitle: "My Knowledge Base",
    enableSPA: true,
    enablePopovers: true,
    analytics: null,
    baseUrl: "example.com",
    ignorePatterns: ["private", ".obsidian"],
    defaultDateType: "created",
    theme: {
      fontOrigin: "googleFonts",
      cdnCaching: true,
      typography: {
        header: "Schibsted Grotesk",
        body: "Source Sans Pro",
        code: "IBM Plex Mono",
      },
      colors: { /* light/dark palettes */ },
    },
  },
  plugins: {
    transformers: [...],
    filters: [...],
    emitters: [...],
  },
}

Layout

Content and layout are decoupled:

my-site/
├── quartz.config.ts       # site configuration
├── quartz.layout.ts       # page layout (header, sidebar, footer)
├── content/               # your Markdown files live here
│   └── index.md
├── quartz/                # framework internals (do not edit)
└── public/                # generated output