made with Svelte

Svelte Markdown

Markdown & HTML Renderer

Visit Site

Description

Markdown & HTML Renderer

"@humanspeak/svelte-markdown is a powerful, customizable markdown renderer for Svelte with TypeScript support.

It's built for streaming AI agent output from Claude Code, ChatGPT, and agentic workflows, and offers XSS-safe defaults and token caching."

  • πŸ”’ Secure HTML parsing via HTMLParser2 with built-in XSS defaults (protocol allowlist, on* handler stripping)
  • πŸš€ Full markdown syntax support through Marked
  • πŸ’ͺ Complete TypeScript support with strict typing
  • πŸ”„ Svelte 5 runes compatibility
  • βœ‚οΈ Inline snippet overrides — customize renderers without separate files
  • 🎨 Customizable component rendering system
  • β™Ώ WCAG 2.1 accessibility compliance
  • 🎯 GitHub-style slug generation for headers
  • πŸ§ͺ Comprehensive test coverage (vitest and playwright)
  • 🧩 First-class marked extensions support via extensions prop (e.g., KaTeX math, alerts)
  • ⚑ Intelligent token caching (50-200x faster re-renders)
  • πŸ“‘ LLM streaming mode with incremental rendering (~1.6ms avg per update)
  • πŸ–ΌοΈ Smart image lazy loading with fade-in animation

Social Media Links

Svelte Slidy Carousel Component
icon-eye-dark Created with Sketch. 5.253
Svelte Medium Image Zoom Medium.com-inspired Image Zooming
icon-eye-dark Created with Sketch. 502
Sentry for Svelte Svelte Error & Performance Monitoring
🧑 Sponsored by Friends
We’re hosting on Digital Ocean! πŸ’™ Try it today and get a free $100 credit.
Svelte Maplibre Svelte Wrapper for the MapLibre Mapping Library
icon-eye-dark Created with Sketch. 1.338
@svelte-plugins/tooltips Tooltip Action & Component
icon-eye-dark Created with Sketch. 1.295