Website · Playground · Documentation · 简体中文
Fluxdown renders streaming Markdown for AI chat and live writing in React, Vue 3, Svelte 5, Angular, React Native, React Lynx, Vue Lynx, SolidJS, Taro, and Uni App. Its shared core keeps content readable from unfinished syntax to the final response.
- Smooth streaming. Reveal incoming text gradually and handle unfinished links, emphasis, and code.
- Less repeated work. Block-level caching reuses stable content as the message grows.
- Familiar Markdown. Render GFM tables, task lists, strikethrough, and autolinks, with code highlighting and optional math.
- Adaptable presentation. Customize themes, replace components, or extend parsing and rendering with plugins.
- A framework-independent core. Share parsing, syntax repair, and reactive content blocks across frameworks, or build your own renderer.
In a React 18 or 19 app:
pnpm add fluxdownimport { Fluxdown } from "fluxdown";
type MessageProps = {
text: string;
isStreaming: boolean;
};
export function Message({ text, isStreaming }: MessageProps) {
return <Fluxdown text={text} streaming={isStreaming} />;
}Pass the full message received so far as text. Set isStreaming to false when generation finishes, is cancelled, or fails. For static content, omit streaming.
If your bundler does not load the styles automatically, add this to your app's global style entry:
import "fluxdown/styles.css";See the quick starts for React, Vue 3, Svelte 5, Angular, React Native, React Lynx, Vue Lynx, SolidJS, Taro React, and Uni App for more examples.
| Package | Use it for |
|---|---|
fluxdown |
Ready-to-use Markdown rendering in React. |
@fluxdown/vue |
Ready-to-use Markdown rendering in Vue 3. |
@fluxdown/svelte |
Ready-to-use Markdown rendering in Svelte 5. |
@fluxdown/angular |
Ready-to-use Markdown rendering in Angular. |
@fluxdown/react-native |
Ready-to-use Markdown rendering in React Native. |
@fluxdown/react-lynx |
Ready-to-use Markdown rendering in React Lynx. |
@fluxdown/vue-lynx |
Ready-to-use Markdown rendering in Vue Lynx. |
@fluxdown/solid |
Ready-to-use Markdown rendering in SolidJS. |
@fluxdown/taro |
Ready-to-use Markdown rendering in Taro React. |
@fluxdown/uni-app |
Ready-to-use Markdown rendering in Uni App x Vapor. |
@fluxdown/core |
Parsing, repair, and reactive content blocks for a custom renderer. |
stative |
Composable state and derived computations, also used by Core. |
- React streaming — connect incoming text and control streaming effects.
- React styling — adjust themes, typography, and layout.
- React plugins — customize syntax, content, and interactions.
- Core — work with reactive content blocks directly.
- Stative — create and compose state flows.
Bug reports, documentation improvements, and pull requests are welcome. Use issues to report bugs or discuss ideas. A minimal reproduction helps us investigate a problem.
See CONTRIBUTING.md for development setup and pull request guidelines. Report vulnerabilities privately as described in SECURITY.md.
Thanks to everyone who contributes code, documentation, bug reports, and ideas.
