Examples › Track 1 — Parser › Example 4

Themes & emitStyles

Two ways to style quikdown's output: CSS classes (with a stylesheet) or inline styles (no stylesheet needed). The parser ships a emitStyles() helper that gives you a generated stylesheet for either light or dark theme — useful when you want to ship one CSS file alongside your markdown rendering.

Live preview

Generated stylesheet

This is the output of quikdown.emitStyles('quikdown-', 'light'). Copy it into your CSS file to theme the rendered HTML.


      

How it works

CSS classes mode (default): the parser emits HTML like <p class="quikdown-p">...</p>. You provide the styles for those classes (or use the output of emitStyles).

Inline styles mode (inline_styles: true): the parser emits HTML like <p style="margin:...">...</p>. No external stylesheet required — useful when you can't ship CSS (HTML emails, embedded snippets, web components with no shadow DOM).

emitStyles helper: generates a complete stylesheet for the class-based output. Pass a prefix and an optional theme name. The output is a string of CSS you can write to a file or inject into a <style> tag.