skills.rest
browleytwilio
browleytwilioCOMMUNITY
Explore all skills by this author →
GitHub

streamdown

Render streaming Markdown in React with code, Mermaid, and math plugins.

Updated Apr 10, 2026
Search Tags:#markdown#react#mermaid#streaming#plugins#math#cjk
One-click install
npx skills add https://github.com/browleytwilio/segmentdemobuilder --skill streamdown-browleytwilio
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: streamdown
Source: https://github.com/browleytwilio/segmentdemobuilder/tree/main/.agents/skills/streamdown
Command: npx skills add https://github.com/browleytwilio/segmentdemobuilder --skill streamdown-browleytwilio

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes assets (resource) and references (resource) components.

What problem does it solve?

Streamdown helps developers render streaming Markdown in React with fast, incremental updates, built-in syntax highlighting, Mermaid diagrams, math rendering, and CJK support, while providing security controls and a path for AI streaming integration.

Core Features & Use Cases

  • Streaming, block-by-block Markdown rendering suitable for chat interfaces and live docs
  • Plugin system with code highlighting, Mermaid diagrams, math, and CJK support
  • Safety and configuration features including link safety, sanitization, and hardening
  • Easy integration with AI streaming workflows and customization of styling and theming
  • Supports static mode for blogs/docs and interactive controls for UI

Quick Start

Install the streamdown package and wrap your Markdown content with the Streamdown component to start streaming.

Frequently Asked Questions about streamdown

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I render streaming Markdown in a React chat interface?▼

To render streaming Markdown in React, wrap your content with the Streamdown component to enable fast, block-by-block updates suitable for chat interfaces and live docs.

What is the best way to display Mermaid diagrams and math in streaming AI responses?▼

Displaying Mermaid diagrams and math in streaming AI responses is handled through a modular plugin system that incrementally parses and formats blocks as they arrive.

Does this streaming Markdown renderer support CJK text and syntax highlighting?▼

Yes, this streaming Markdown renderer supports CJK text and syntax highlighting through its configurable plugin architecture, ensuring proper rendering of Asian characters and colorized code blocks.

Can I use this for static documentation instead of live streaming?▼

You can use this for static documentation by enabling static mode, which renders Markdown content for blogs and docs without the interactive streaming controls required by chat UIs.

How does safe HTML handling work during Markdown rendering?▼

Safe HTML handling works by applying rehype and default plugins to sanitize Markdown, providing link safety, content sanitization, and security hardening against malicious scripts.

Do I need additional dependencies to enable code highlighting and math plugins?▼

No additional external dependencies are required to enable code highlighting and math plugins, as the system manages modular configuration and plugin integration internally.

Related Skills

Explore More Software Engineering Skills→
remiconnessonremiconnesson

streamdown

Render Markdown in React with streaming AI responses and syntax highlighting.

Community
Advanced
mykcsmykcs
1

theme-factory

Apply curated font and color palettes to presentation and documentation artifacts.

Community
Intermediate
ojpbarbosaojpbarbosa

streamdown

Render streaming Markdown content in real-time for AI apps.

Community
Intermediate
whichguywhichguy

html-artifact

Generate self-contained HTML files from Markdown content.

Community
Intermediate