Skip to main content
Quartz is configured through two primary files in your project root:
  • quartz.config.ts - Site settings, theme, and plugins
  • quartz.layout.ts - Page layout and component placement

​
QuartzConfig Structure

The main configuration file exports a QuartzConfig object with two main sections: 
const config: QuartzConfig = {
  configuration: {
    // Site settings and theme
  },
  plugins: {
    // Content processing pipeline
  }
}

​
Configuration Sections

Site Settings

Configure page title, locale, base URL, and site behavior

Theme

Customize colors, typography, and fonts for light and dark modes

Layout

Organize components and define page structure

Plugins

Add transformers, filters, and emitters to extend functionality

​
Quick Example

Here’s a minimal Quartz configuration:
quartz.config.ts
import { QuartzConfig } from "./quartz/cfg"
import * as Plugin from "./quartz/plugins"

const config: QuartzConfig = {
  configuration: {
    pageTitle: "My Digital Garden",
    enableSPA: true,
    enablePopovers: true,
    locale: "en-US",
    baseUrl: "example.com",
    theme: {
      typography: {
        header: "Schibsted Grotesk",
        body: "Source Sans Pro",
        code: "IBM Plex Mono",
      },
    },
  },
  plugins: {
    transformers: [Plugin.FrontMatter(), Plugin.GitHubFlavoredMarkdown()],
    filters: [Plugin.RemoveDrafts()],
    emitters: [Plugin.ContentPage(), Plugin.Assets()],
  },
}

export default config

​
Configuration Reference

​
configuration

The configuration object contains all site-wide settings:
​
pageTitle
string
required
The title displayed in the browser tab and site header
​
pageTitleSuffix
string
Suffix appended to page titles (e.g., ” - My Site”)
​
enableSPA
boolean
default:true
Enable Single Page Application mode for faster navigation
​
enablePopovers
boolean
default:true
Show content previews when hovering over links
​
locale
string
default:"en-US"
Language and region code (e.g., “de-DE”, “fr-FR”)
​
baseUrl
string
required
Your site’s domain without protocol (e.g., “example.com”)
​
ignorePatterns
string[]
Folders or files to exclude from the build
​
defaultDateType
'created' | 'modified'
default:"created"
Which date to display by default
​
theme
ThemeConfig
Theme configuration including colors, typography, and fonts

​
plugins

The plugins object defines the content processing pipeline:
  • transformers - Process content during the build (Markdown, syntax highlighting, etc.)
  • filters - Determine which pages to include/exclude
  • emitters - Generate output files (HTML pages, RSS, sitemap, etc.)

​
Next Steps

1

Configure Site Settings

Set up your site title, locale, and base URL in Site Settings
2

Customize Theme

Define your color scheme and typography in Theme Configuration
3

Design Layout

Arrange components and structure your pages in Layout Configuration

Build docs developers (and LLMs) love

Get started for freeTalk to us