Marp Live View

English | 日本語

Write your Marp slides and watch them live. A Windows launcher that opens a Marp CLI preview with your own custom CSS applied — one click, no command line — and refreshes the moment you save the Markdown.

Why this exists

If you write presentations in Marp, some of this may sound familiar.

• Exporting to PDF or HTML just to check how it looks gets old fast. You don't want to rebuild after every one-character fix.
• You spot a typo right before — or during — your talk. You want to fix it and have the screen update immediately.
• The VS Code preview is handy, but you want to see the final look with your own custom CSS applied.
• marp -p --theme ... does the job, but typing the path every time is tedious, and worse when you switch between several stylesheets.

This app replaces that friction with a GUI. Pick a Markdown file, pick a custom CSS, hit Run. From then on, every save in your editor refreshes the preview automatically. No more export step.

You can leave the preview window up while presenting. Need a correction? Fix it in your editor, save, and it is on screen. No regenerating the PDF.

Who it's for

• People who know Marp but don't want to fight a toolchain. No cloning a repo, no installing Python — download one exe and run it.
• People who could build it from source but would rather not bother. Same answer: the exe is self-contained.
• People juggling several custom stylesheets who want to switch between them from a dropdown.

Requirements

Item	Details
OS	Windows only (macOS / Linux are not supported)
Needed	marp.exe from Marp CLI, and Chrome or Edge
Python	Not required when using the exe build

macOS and Linux are out of scope. Process control and folder-opening rely on Windows-specific APIs, so the code will not run as-is elsewhere.

Install

1. Download Marp Live View

Grab MarpLiveView.exe from the releases page and drop it in a folder of your choice (for example C:\MarpLiveView\).

There is no installer. Placing the file is the whole procedure.

2. Put Marp CLI in the same folder

Download the Windows build (marp-cli-vX.X.X-win.zip) from the Marp CLI releases page, extract it, and place the resulting marp.exe in the same folder as MarpLiveView.exe.

C:\MarpLiveView\
├─ MarpLiveView.exe   ← this app
└─ marp.exe           ← Marp CLI (same folder)

If marp.exe is already on your PATH, it does not need to sit alongside the app. To point at a specific copy, set marp_path in the settings file.

3. Run it

Double-click MarpLiveView.exe.

If Windows warns you The binary is unsigned, so you may see "Windows protected your PC". Choose More info → Run anyway. If you would rather not trust a prebuilt binary, read the source and build it yourself — see Running from source below.

Usage

1. Click Browse and choose a Markdown file
2. Choose a custom CSS from the dropdown (or "(none)")
3. Click Run — the preview window opens
4. Edit the Markdown in your editor and save; the preview updates on its own
5. Click Stop to close the preview

The Show log / Hide log button toggles the log pane. Logging continues while it is hidden, and the open/closed state is remembered for next launch.

Display language

The interface is available in English and Japanese, switchable from the Language menu. The change applies immediately — no restart — and is remembered for next launch.

On first run the app follows your Windows display language: Japanese if that is what Windows is set to, English otherwise. Lines already written to the log pane stay in the language they were written in; they are a record of what happened, not something to re-translate.

The Language menu controls the app's own UI only. The language of your slides is a separate setting — see About lang.

The command actually being run is:

marp.exe -p --bespoke.osc=false -c <lang config> [--theme <fetched CSS>] -o <output> <target.md>

--bespoke.osc=false hides the on-slide navigation overlay.

When auto-refresh doesn't fire

Files on shared drives (Google Drive and similar) may not emit change notifications, so the preview will not know to reload. Press F5 or Ctrl+R in the preview window to pull the latest build.

If you close the preview window

Reopen it from the menu: File → Open in default browser. Auto-refresh keeps working.

Custom CSS

Register, edit, and remove stylesheets from the Edit... button, or the menu at CSS → Edit custom CSS....

Two kinds of entry are supported.

Type	Use for
URL	CSS published somewhere public, e.g. GitHub Pages
Local file	A .css on your machine

URL entries are re-fetched on every Run. Update what you publish and the next run picks it up; there is nothing to refresh by hand. If the fetch fails, the app falls back to the last copy it retrieved, so it still works offline.

You cannot hand a URL to marp --theme directly — and crucially, it does not error out; it silently falls back to the default theme. That is why this app downloads the CSS to a local file first and passes that to marp.

Why fetching first is necessary

Most Marp themes pull in a built-in theme with @import "default";. That is Marpit syntax resolved at build time, not CSS a browser can act on.

If you let the browser load the stylesheet via @import url(...), that line is treated as a relative URL named "default", 404s, and the entire default theme — roughly 48 KB of margins, font sizing, headings, list styling — vanishes. You get a broken, zero-margin layout with only the theme's own colors and backgrounds applied.

Passing the fetched CSS to --theme as a file lets marp resolve @import "default" at build time and rewrite selector scoping correctly.

Where entries are stored

In themes.json, next to the executable. The GUI writes it, but editing it by hand is fine — then use CSS → Reload to pick up your changes.

{
  "themes": [
    {
      "id": "my-theme",
      "label": "My theme",
      "type": "url",
      "url": "https://example.github.io/marp-theme/theme.css"
    },
    {
      "id": "local-theme",
      "label": "Local theme",
      "type": "path",
      "path": "css/my-theme.css"
    }
  ]
}

id accepts lowercase letters, digits, and hyphens only. default, gaia, and uncover are reserved — they are Marp's built-in theme names.

Relative path values resolve against the folder holding themes.json. Absolute paths work too.

If you run from source, themes.example.json ships as a starting point, along with a sample pair (sample/sample.md and sample/sample-theme.css).

Settings

Stored in %LOCALAPPDATA%\MarpLiveView\settings.json — open it via CSS → Open settings folder.

Key	Default	Description
marp_path	null	Where marp.exe lives. null means auto-detect
output_mode	"beside"	beside = write next to the Markdown / cache = write to the settings folder
lang	"ja"	Value for <html lang>. Set null to omit it
extra_args	["--bespoke.osc=false"]	Extra arguments appended to -p, e.g. --bespoke.progress
last_markdown		Last Markdown opened (saved automatically)
last_theme_id		Last CSS selected (saved automatically)
show_log	false	Whether the log pane is visible (button state, saved automatically)
ui_lang	null	UI language, "ja" or "en". null follows the Windows display language (menu state, saved automatically)
schema_version		Settings version, used to migrate when defaults change. Leave it alone

About output_mode

The default, beside, writes .<name>.preview.html into the same folder as the Markdown.

Keep it on beside if your slides use images. marp emits ![](pic.png) as <img src="pic.png"> without rewriting it to an absolute path. The browser resolves that against the location of the HTML, so putting the HTML in a different folder breaks every relative image.

The leading dot in the filename keeps the preview from overwriting a <name>.html you exported yourself.

Setting cache writes to %LOCALAPPDATA%\MarpLiveView\preview\ instead. Useful when you would rather not add files to a shared folder — but as above, relative-path images will not load (the app warns about this in the log at run time).

About lang (suppressing the translation bar)

This is the language of the slides you produce, not the app's interface — for that, use the Language menu (ui_lang).

By default, marp emits <html lang="en-US">. Open a deck written in another language and the browser decides it is looking at an English page and offers to translate it.

To avoid that, the app generates a config file containing only the lang value at %LOCALAPPDATA%\MarpLiveView\marp.config.json and passes it to marp with -c.

This indirection exists because lang is not a marp CLI option — --lang ja is silently ignored — and can only be set from a config file or the Markdown front matter.

If you maintain your own marp.config.js or .marprc, passing -c means yours no longer gets read. In that case set lang to null: the app stops passing -c, marp resolves config files normally, and you specify lang in your own config instead.

Running from source / building it yourself

Python 3.11+ is enough — the app uses only the standard library, so there is nothing to install.

git clone https://github.com/23style/marpLiveView.git
cd marpLiveView
copy themes.example.json themes.json
python -m marp_viewer

Double-clicking MarpLiveView.pyw also launches it, without a console window. Put marp.exe in this folder.

Standalone distributable builds are made with PyInstaller.

pip install pyinstaller
pyinstaller MarpLiveView.spec

This produces dist\MarpLiveView.exe. At run time, marp.exe and themes.json are looked up relative to the executable itself.

The icon is icon\marp_live_view.ico; replace that file and rebuild to change it.

Project layout

marpLiveView/
├─ MarpLiveView.pyw      Double-click launcher (source version)
├─ MarpLiveView.spec     PyInstaller build config
├─ themes.example.json   Template for the custom CSS registry
├─ themes.json           Your registered stylesheets (create your own; git-ignored)
├─ marp.exe              Marp CLI (download separately; git-ignored)
├─ icon/
│  └─ marp_live_view.ico Application icon
├─ sample/
│  ├─ sample.md          Sample deck
│  └─ sample-theme.css   Sample custom theme
└─ marp_viewer/
   ├─ app.py             Main window
   ├─ dialogs.py         CSS manager dialog and input forms
   ├─ i18n.py            UI strings for English and Japanese
   ├─ runner.py          Starting and stopping marp.exe
   ├─ themes.py          CSS definition, validation, resolution
   └─ config.py          Settings file and folders

License

MIT License

marp.exe (Marp CLI) is not bundled — download it yourself. Marp CLI is MIT-licensed as well.