OSS Tanbou
View on GitHubProject website

Ladle — develop and review React components as isolated stories

OSS scale score 190.6OSS health 76Update pace 0 commits/30d
About these scores

OSS scale score is an unbounded metric that log-compresses and weights Stars, Watchers, Forks, and Contributors. Discovery score is the current OSS scale score minus the score at discovery. Update pace is commits in the last 30 days, growth momentum is the OSS scale score difference within the recent observation window, and OSS health is a 0–100 rating based on available recency, Community Health, and release data.

Stars
2,985
Primary language
TypeScript
License
MIT
Repository last updated
Jun 28, 2026

Overview

Ladle is a Vite-based component workbench for React. Stories isolate components from the full application so teams can iterate quickly, document states, and share UI behavior.

Features and best fit

Based on official documentation; not hands-on tested · Content checked:

Launch a component sandbox from `.stories.tsx` files

Create story files and run ladle serve to get an automatically assembled component environment.

Sources: [2][3]

Add accessibility checks, MSW, decorators, and providers

The environment can include a11y checks, mock APIs, providers, decorators, and related component-development tooling.

Sources: [3][4]

For React UI libraries and design-system component development

It fits teams that want components developed independently from the application and reviewed as shareable states.

Sources: [2]

Verify Storybook ecosystem compatibility and Node requirements

Although the use case overlaps with Storybook, configuration and add-ons are not identical. Check existing stories, addons, and visual-test integrations before migration.

Sources: [4][3]

Official sources

  1. [1]tajo/ladle repository(2026-09-21)
  2. [2]Ladle README(2026-09-21)
  3. [3]Ladle documentation(2026-09-21)
  4. [4]@ladle/react package(2026-09-21)
  5. [5]Ladle MIT license(2026-09-21)
Supplemental curator note

The current `@ladle/react` package is 5.1.1 and requires React/React DOM 18+ plus Node.js 22.12+. Ladle is often evaluated beside Storybook, but add-on ecosystems and story compatibility should be verified for each project.

Try it in 3 steps

  1. 1

    Initialize a Ladle project

    Follow the npm Quick Start from the official README.

    mkdir my-ladle && cd my-ladle && npm init --yes && npm install @ladle/react react react-dom
  2. 2

    Create the first story

    Add a React component as an isolated story file.

    mkdir src && echo "export const World = () => <p>Hey</p>;" > src/hello.stories.tsx
  3. 3

    Start Ladle

    Open the story environment and review the component independently from the full application.

    npx ladle serve
Check the official README

Growth

Growth trends · Last 30 days

2,985 Stars

Trend data is still being collected.

Development activity

Last 90 days · weekly

Commits (last 30 days)
0
Open PRs
10

Development activity is still being collected.

Built with

Categories and tags

Categories

Tags

GitHub data

GitHub dataView detailed GitHub data
View on GitHub

GitHub Topics

  • playground
  • react
  • javascript
  • testing
  • components
  • documentation
  • styleguide
  • typescript
  • ui
  • esbuild
  • vitejs
  • stories
Stars
2,985
Forks
121
Watchers
6
Open issues
36
Contributors
61
Primary language
TypeScript
License
MIT
Repository last updated
Jun 28, 2026
Write a related article

Share a guide or use case for this OSS in Markdown. Articles are published after administrator approval.

Report incorrect information

Tell us if any listing information is incorrect or outdated.