Fancy Markdown

Fancy Markdown is a VS Code extension designed to preview and export Markdown documents using custom CSS style sheets. Easily load CSS stylesheets from local directories, workspace paths, remote URLs, or even active unsaved buffers, and export your stylized Markdown to clean HTML or high-fidelity PDF documents.

Features

• Live CSS Styling: Preview your Markdown dynamically with custom styles.
• Flexible CSS Sources: Load stylesheets from local filesystem, internet URLs, workspace files, or in-memory untitled buffers.
• Real-time Synchronization: Update preview automatically on document changes (Markdown & CSS).
• Cursor Synchronization: Automatically scroll the webview preview to match your editor cursor position, highlighting the active block.
• Portables Export: Save your stylized work to HTML (autocontained inline styles) or PDF format using a local Chromium engine.

Usage Commands

• Fancy Markdown: Preview with CSS - Opens the side-by-side webview preview panel.
• Fancy Markdown: Select CSS Style Sheet - Configures the style sheet to apply on the active Markdown.
• Fancy Markdown: Export to HTML - Generates a standalone HTML document.
• Fancy Markdown: Export to PDF - Generates a print-ready PDF document.

Page Breaks

You can add page breaks to your Markdown documents that will be visually displayed in the editor preview and will split pages when exporting to HTML or PDF.

Supported formats:

1. Comments: Add a special page break comment:

   <!--- Page Break --->
   

   (Also accepts case-insensitive variations like <!-- page-break -->, <!-- pagebreak -->, or <!-- Page Break -->).

2. Custom Divider: Write ---/--- on a line by itself:

   ---/---
   

Requirements

To export Markdown documents to PDF format, this extension requires a Chromium-based browser (such as Google Chrome, Microsoft Edge, Chromium, or Brave) to be installed on your system.

The extension automatically attempts to detect standard installations of these browsers. If your installation is not detected (for example, if you are using a portable version, a custom installation path, or a Linux package not in the default path), you will need to specify the absolute path to the browser executable in the extension settings (see below).

Extension Settings

This extension contributes the following settings:

• fancy-markdown.pdf.executablePath: Absolute path to a Chromium-based browser executable (Chrome, Edge, etc.) for PDF exports.

Development

To run the extension locally:

1. Open the repository in VS Code.
2. Run pnpm install to load dependencies.
3. Press F5 to launch the Extension Development Host.