This plugin styles your site with an Obsidian community theme from Quartz Themes: hundreds of themes, converted from their Obsidian CSS. The theme’s CSS is added to every page; the dark mode toggle switches between its light and dark variants.
Note
For information on how to add, remove or configure plugins, see the Configuration page.
A theme colours the page through Obsidian’s CSS variables, so configuration.theme.colors then has little or no effect; see Configuration for overriding a theme’s colours. With Fonts enabled, the theme’s fonts are used as defaults (Quartz Themes runs first, at order 10).
Configuration
This plugin accepts the following configuration options:
theme: The theme’s id, e.g.tokyo-night,catppuccin,minimal. Defaults to"tokyo-night".mode:"both","light"or"dark". Defaults to"both". With a single mode (or a theme that only has one), the dark mode toggle is hidden and the site stays in that mode.variation: A variation of the theme, if it has any (e.g.frappeforcatppuccin).aspects: Take single aspects from other themes, or leave them out withfalse, e.g.{ callouts: anuppuccin, code: false }. Aspects:base,headings,typography,callouts,tables,code,links,blockquotes,checkboxes,images,embeds,cards,search,scrollbars,explorer,toc,graph,popover,footer,recentNotes,listPage,darkmode,breadcrumbs,lists,canvas,bases,properties,stacked,misc.include: Only include these aspects (plus those set inaspects). Defaults to all.themeFonts: Whether to include the theme’s fonts. Defaults totrue.styleSettings: Settings for themes that support the Obsidian Style Settings plugin: an export from that plugin, or the path to a JSON file holding one. Keys look likeminimal-style@@bg1.
Default options
The default config has a disabled entry for this plugin. Set enabled: true to use it:
- source: "@quartz-themes/core"
enabled: true
options:
theme: tokyo-night
mode: bothMixing aspects:
- source: "@quartz-themes/core"
enabled: true
options:
theme: tokyo-night
mode: both
aspects:
callouts: anuppuccin
tables: minimal
code: falseAPI
- Category: Transformer
- Function name:
ExternalPlugin.QuartzTheme(). - Source:
quartz-themes/core - Install:
npx quartz plugin add @quartz-themes/core