Marp Theme

VS Code / Cursor extension to manage standalone Marp theme CSS globally: discover themes, import them, pick an active theme for preview and export, without copying CSS into every slide deck.

Requires Marp for VS Code.

Marketplace: purestone.marp-theme
Repository: Purestone/marp-theme-vscode

Why this extension exists

Marp for VS Code only loads custom themes from:

http(s)://… URLs, or
paths inside the current workspace

Absolute / file:// paths outside the workspace are ignored. Relative url(./fonts/…) in theme CSS also resolves against the Markdown file, not the CSS file—so ordinary theme packs break when you open a deck elsewhere.

Marp Theme works around that by:

Discovering standalone theme CSS (fonts and images embedded as data: URIs)
Serving them from a local http://127.0.0.1:<port>/… server
Registering those URLs in markdown.marp.themes (user + workspace settings)

Any Marp Markdown can then use theme: your-theme-name for preview and export.

Install

From the Marketplace:

code --install-extension purestone.marp-theme

Or search Marp Theme in the Extensions view. After install, Developer: Reload Window, then run Marp Theme: Refresh Theme List.

Bundled themes

`@theme` name	Look
`usyd-ochre`	University of Sydney–style chrome in Beamer ochre `#EC5F32` (title / top bar / lead)
`usyd-black`	Same layout with black chrome; accent still `#EC5F32`

Both include GitHub Prettylights–style highlight.js colors for fenced code blocks (aligned with Marp’s default highlighter).

Theme sources

Location	Role
Extension `themes/`	Bundled standalone CSS
Extension global storage `…/marp-theme/themes/`	Themes added via Import Standalone CSS…
Workspace `themes/`	Auto-scanned when a folder is open
`marpTheme.themesFolders`	Extra directories listed in settings

Standalone CSS rules

A file is accepted only if:

It starts with /* @theme theme-name */
It does not use local url(./…), url(../…), or absolute file: / disk paths

Embed fonts and images as data: URIs (or use remote https: URLs).

Select Active Theme

Command: Marp Theme: Select Active Theme…

Choice	Effect
(none)	Clears `marpTheme.activeTheme` and removes `theme:` from the current Marp frontmatter
default	Sets Marp’s built-in `theme: default`
Custom name	Sets that registered `@theme` and applies it to the open Marp document when possible

Empty active theme means “do not force a theme.” Per-file theme: is left alone until you Select / Apply.

Settings

Setting	Description
`marpTheme.activeTheme`	Active theme name. Empty = none. `default` = Marp stock theme. Otherwise a registered custom `@theme`.
`marpTheme.importedThemes`	List of imported theme names (synced from the import folder). Remove an entry to delete that imported CSS file.
`marpTheme.themesFolders`	Extra folders of standalone `.css` files
`marpTheme.autoApply`	If active theme is set: fill missing `theme:` on open; sync the current doc when active theme changes
`marpTheme.registerWithMarp`	Register discovered themes as localhost HTTP URLs in `markdown.marp.themes`

Commands

Marp Theme: Select Active Theme…
Marp Theme: Apply Active Theme to Document
Marp Theme: Import Standalone CSS…
Marp Theme: Delete Imported Theme…
Marp Theme: Refresh Theme List
Marp Theme: Open Themes Folder
Marp Theme: New Slide Deck

Usage

Install this extension and Marp for VS Code.
Marp Theme: Select Active Theme… → e.g. usyd-ochre.
Open Markdown preview with Marp enabled, or export via Marp’s export command.

---
marp: true
theme: usyd-ochre
paginate: false
size: 16:9
math: mathjax
---

<!-- _class: title -->

# Title

Subtitle

Slide classes (bundled USYD themes)

Markup	Role
`<!-- _class: title -->`	Title slide (ochre or black background; logo bottom-right)
Lone `# Heading`	Section divider
`## Heading`	Content slide (title in the top bar)
`<!-- _class: lead -->`	Centered closing slide
`<div class="columns">`	Two-column layout
`<span class="accent">`	Accent-colored emphasis

Development

# From the extension repo root
npm run package    # builds .vsix
npm run publish    # publishes to Marketplace (publisher credentials required)

Rebuild bundled themes from the sibling template project (if present):

python3 ../scripts/build-standalone.py   # also syncs into extension/themes/

License

MIT