What technology for design system documentation ?

To build a Documentation site, we recommend to use a technology that can embed your real component from your Component Library . This way your documentation is effortlessly up to date with the latest component visuals from your Design System .

Idealy, you also want to have your Design System documentation in the same repository of your Component Library so you maintain, branch, version and release from a single source.

MDX

MDX is a popular technology to write documentation in Markdown enriched with React components.

For more details, see How to write your Design System documentation with MDX and React

Backlight

Backlight supports MDX as a documentation framework.

MD Vue

MD Vue let you write Markdown enriched with Vue components.

MD Vue is used by VuePress and Vitepress .

Backlight

Backlight supports MD Vue as a documentation framework.

mdjs

mdjs let you write Markdown and enrich it with JavaScript giving you the ability to define Web Components.

mdjs has been developed by the Modern Web team and currently used in Rocket .

Backlight

Backlight supports mdjs as a documentation framework.

Astro

Astro is a static site generator that can embed components in different frameworks. It also have great support for Markdown with components close to MDX.

Backlight

Backlight support of Astro as a documentation framework is currently under development.