⚠️ Deprecation Notice ⚠️

The Catalog project has been deprecated and is no longer under active development or maintenance. Existing users may continue to use it at their own discretion, but no further updates or support will be provided.

For new work, consider alternatives below (depending on your goals — component “playgrounds”, design-system docs, or UI documentation).

Storybook — The most widely used UI component explorer with a rich ecosystem of addons. Great for React, Vue, and other frameworks.
Ladle — Lightweight, fast alternative to Storybook built on Vite. Minimal configuration, simple setup.
Zeroheight — Design-system documentation platform used by designers; integrates tightly with Figma and design tokens.
Supernova — Professional design-system management platform combining docs, tokens, and code.
GitBook — Hosted documentation platform with excellent UX and collaboration features. Great for design system and product documentation.
Docusaurus — Open-source static site generator for documentation, built with React and Markdown. Excellent for technical or design system sites.

🚧 This is the currently in-development v4 branch. Stable code is in master.

Catalog

Catalog lets you create beautiful living and fully interactive style guides using Markdown and React components.

Please read the Catalog documentation (built with Catalog!) for detailed installation and usage instructions.

Installation

yarn

yarn add catalog react react-dom

npm

npm install catalog react react-dom --save

Development

Please make sure that you have Node >= 6 and yarn installed.

Build process

Start the build process in watch mode:

make

Docs

To edit Catalog documentation, run:

make docs

Note: this uses the local Catalog build from dist/. Run make before/alongside make docs.

Linking

When developing Catalog you want to link it locally:

yarn link

You can then link to this version in your project (or one of the examples):

yarn link catalog

Tests

To run Jest tests in watch mode:

make test-watch

Creating a Release

Bump Catalog's version:

make version

Then push including tags:

git push && git push --tags

The CI server will automatically run tests, build and publish the new version to npm

CI commands

These usually run automatically on the CI server

Create a build

make build

Create a documentation build

make build-docs

Publish to npm and generate GitHub release notes

make publish

Credits

Catalog is developed by many people at Interactive Things, a User Experience and Data Visualization Studio based in Zürich.