Pele – Mermaid diagrams as themeable SVG

Pele is a lightweight JavaScript library that converts Mermaid diagram text into themed SVGs using CSS variables. Write Mermaid syntax and call render() to get an SVG string you can insert into the DOM; color, font, and surface styles are controlled with pele- prefixed CSS variables so visual changes apply instantly without re-rendering. It supports every diagram type included in Mermaid 12.1.0, adapts layouts for small screens, and scales diagrams to fit. Documentation includes examples, a playground to edit Mermaid text and see the SVG output, a theming guide, and a compatibility comparison to Mermaid for syntax and layout differences.

Pele’s selling points are size and speed: a gzip bundle around 230 kB with zero direct dependencies, and render times reported at roughly 0.05-0.3 ms, compared with Mermaid.js at ~1.6 MB and 6-82 ms render times; those metrics underpin the claim of being 6× smaller and up to 500× faster. Installation is standard (npm, pnpm, yarn, bun) and usage is as simple as import { render } from 'pele' then inserting the returned svg. Pele is open source under the MIT license, originally developed for Obsidian, and named after the Hawaiian goddess Pele.