AI Frameworks · antvis

Infographic

Infographic is an open-source TypeScript framework that generates and renders data visualizations from declarative syntax, with AI-friendly design for streaming output. It includes ~200 built-in templates, components, and a browser editor, targeting rapid infographic creation for data storytelling.

Talk to DEV.co Discuss Implementation

Source: GitHub — github.com/antvis/Infographic

5.6k

GitHub stars

426

Forks

TypeScript

Primary language

MIT

License (OSI-approved)

Key facts

Objective fields from the source. Values we can't verify are shown as “Unknown” rather than guessed.

Field	Value
Repository	antvis/Infographic
Owner	antvis
Primary language	TypeScript
License	MIT — OSI-approved
Stars	5.6k
Forks	426
Open issues	18
Latest release	0.2.19 (2026-05-06)
Last updated	2026-06-01
Source	https://github.com/antvis/Infographic

What Infographic is

A declarative SVG-rendering engine written in TypeScript that parses custom infographic syntax (designed for AI generation) into high-quality visualizations. Features streaming-tolerant parsing, theme system, and plugin architecture for AI agent integration (Claude, Codex skills); built on AntV ecosystem.

Quickstart

Get the Infographic source

Clone the repository and explore it locally.

terminalbash

1git clone https://github.com/antvis/Infographic.git2cd Infographic3# follow the project's README for install & configuration

Need it deployed, integrated, or customized instead? DEV.co ships production installs.

Best use cases

AI-assisted infographic generation workflows

Generate infographics from LLM output in real time using streaming syntax rendering, with built-in editor for refinement. Ideal for content platforms, report generators, and AI agents that need visual output.

Internal data visualization dashboards and reports

Leverage ~200 templates and reusable components to build custom dashboards and reports quickly without designing graphics from scratch. SVG output enables further editing and export.

Markdown and documentation enhancement

Integrate infographics into blogs, documentation, and knowledge platforms via plugins (Obsidian, Docsify, markdown-it, VSCode). Combine narrative and visual storytelling in existing content workflows.

Implementation considerations

Infographic syntax has a learning curve; budget time for team training or rely on AI generation. Streaming-tolerant parsing is a feature, but malformed input behavior is undocumented.
TypeScript codebase; requires Node.js/npm build pipeline. No pre-built CDN bundles or vanilla JS support documented.
Template library is fixed (~200); custom designs are possible via 'infographic-structure-creator' skill but require AI or manual scripting.
SVG output is high-quality for editing but may not optimize for ultra-mobile or accessibility without post-processing.
AI agent integration (Claude, Codex) is optional; core engine works standalone but full value requires LLM integration.

When to avoid it — and what to weigh

Real-time interactive dashboards at scale — Not designed for high-frequency data updates or complex cross-filtering. Better suited for static or slowly-changing infographics than live operational dashboards.
Custom 3D or immersive visualizations — SVG-based rendering limits to 2D output. Projects requiring 3D charts, WebGL, or advanced interactive effects should look elsewhere.
Closed-source, proprietary requirements — MIT license is permissive but project is open. If you require hidden codebases or cannot accept public dependencies, review licensing implications.
Zero external dependencies or minimal footprint — Unknown bundled size and dependency tree. Assess weight for embedded or mobile-first deployments.

License & commercial use

MIT License (permissive OSI-compliant). No patent, trademark, or commercial use restrictions in the license text. Suitable for proprietary applications, modifications, and distribution.

MIT license allows commercial use without restriction. However, the project is open-source and depends on public AntV ecosystem. Ensure compliance with any transitive dependencies; no formal warranty is granted. Review terms for deployed products.

DEV.co evaluation signals

Editorial assessment — not user reviews. Directional, with an explicit confidence level.

Signal	Assessment
Maintenance	Active
Documentation	Strong
License clarity	Clear
Deployment complexity	Low
DEV.co fit	Strong
Assessment confidence	High

Security considerations

Infographic syntax is user-facing input; script injection via malformed or adversarial input is a consideration—parsing robustness unknown. SVG output may embed user data; sanitize before rendering untrusted input. No security audit or vulnerability disclosure process documented.

Alternatives to consider

D3.js / Observable

Lower-level, highly customizable visualization; requires more coding but offers fine-grained control. Better for bespoke interactive dashboards.

Plotly.js

Pre-built charts and interactive features out of the box. Less geared toward AI generation, but simpler for standard business charts.

Apache ECharts

Declarative configuration, large template library, strong performance. Popular in Chinese markets; less AI-focused than Infographic but mature ecosystem.

Software development agency

Build on Infographic with DEV.co software developers

Infographic combines declarative syntax, streaming rendering, and AI agent skills to automate visual storytelling. Ideal for content platforms, reports, and data-driven applications. Learn more about implementation and integration.

Talk to DEV.co

Related open-source tools

Surfaced by semantic similarity across the DEV.co open-source index.

openui presentation-ai openui

Related on DEV.co

Explore the category and the services that help you build with it.

AI Frameworks AI Application Development Web App Development Custom Software Development Talk to DEV.co

Infographic FAQ

Can Infographic be used without an LLM or AI agent?

Yes. The core engine renders infographics from declarative syntax; you can write syntax manually or use the built-in editor. AI integration is optional for stream-generation workflows.

What is the output format? Can I export to PNG or PDF?

Default output is SVG, which is editable and scalable. PNG/PDF export is not built-in; you would need additional tools (headless browser, node-canvas, etc.).

Is Infographic suitable for real-time dashboards?

No. It is optimized for static or slowly-changing infographics, not live-updating operational dashboards with frequent data changes.

How do I customize themes or add my own templates?

Theme system supports hand-drawn, gradients, patterns, and presets with deep customization options. Custom templates can be generated via the 'infographic-structure-creator' skill or defined manually; exact extension API is undocumented.

Work with a software development agency

Need help beyond evaluating Infographic? DEV.co is a software development agency offering software development services and web development for teams of every size. Our software developers and web developers build custom software, web applications, APIs, and ai frameworks integrations — and maintain them long-term.

Ready to integrate AI-powered infographics?

Talk to DEV.co Schedule a Consultation