Kumo: Cloudflare's React component library, built on Base UI and shipped MIT

Accessibility as the headline promise

Kumo provides accessible, design-system-compliant UI components built on Base UI, and the specific promise is named, it handles keyboard navigation, focus management and ARIA attributes so you can build accessible applications without thinking through every detail. Building on Base UI rather than from scratch delegates the unstyled primitive behavior, the dialog focus traps and popover positioning, to a maintained headless layer, while Kumo contributes the design system compliance, the visual tokens and the Cloudflare conventions. The components named in the usage example, Button, Input and Dialog, are the vocabulary starters, and the styles import alongside them is the one CSS entry the library requires.

Install, peers, and the styles entry

Installation is one command per layer:

pnpm add @cloudflare/kumo

and the peer dependencies are explicit:

pnpm add react react-dom @phosphor-icons/react

so the Phosphor icon set is a declared peer rather than a bundled choice, keeping icon rendering consistent with the host application. The usage imports the components and the stylesheet together:

import { Button, Input, Dialog } from "@cloudflare/kumo";
import "@cloudflare/kumo/styles";

and granular imports exist for tree shaking, importing Button from the components/button path so an application shipping one component does not carry the catalog.

Base UI primitives, re-exported

For the cases the design-system components do not cover, Kumo re-exports all Base UI primitives for advanced use cases, documented with the popover example imported from the primitives path. The re-export matters architecturally, an application can start with Kumo's styled Dialog, outgrow its constraints, and drop to the underlying unstyled primitive without changing libraries, the styled and headless layers sharing one foundation. It also means Base UI's accessibility behavior arrives consistently whether the styled or primitive surface is used, and the primitives path namespace keeps the two imports distinguishable in code review.

A documentation CLI, for agents and humans

The kumo CLI queries component documentation from the command line, with three commands shown, ls listing all components, doc Button fetching a component's documentation, and docs fetching everything. The audience is dual, humans working in terminals and coding agents that read documentation as text, and the repository's development section confirms the orientation, AGENTS.md carries comprehensive development documentation including component patterns and the styling system, semantic color tokens, development workflows, the CI/CD pipeline and the Figma plugin. The docs site lives at kumo-ui.com, and the AI/agent guide is listed beside it as a first-class documentation surface rather than a hidden file.

A workspace built around the docs site

The repository is a pnpm workspace whose build target is the Astro-based docs site, kumo-docs-astro, with a codegen step generating demos before development, and the dev script starting the docs at localhost:4321. The test surface splits between the package's own suite and test:ci running node's test runner over the CI infrastructure itself, preview tests, reporters, scripts and visual regression, the last being the discipline a component library needs, rendered output verified image by image. Format runs through vp, lint chains the package lint with a packages source pass, and a lockfile-check script verifies the lockfile is reproducible by reinstalling and diffing, the supply-chain-flavored check that catches accidental dependency drift.

The Figma plugin, and token sync

The kumo-figma package builds a Figma plugin, with an optional token sync enabled during build through a Figma token in the environment, the documented setup copying the example env file and setting FIGMA_TOKEN and optionally FIGMA_FILE_KEY, then importing the built manifest through Figma's development plugins menu. The plugin closes the designer-developer loop, design tokens flow from Figma into the build rather than being transcribed by hand, and the semantic color tokens named in AGENTS.md are the vocabulary both sides share. The new-component scaffold, pnpm --filter @cloudflare/kumo new-component, completes the contributor path, generating a component wired into the codegen, docs and test conventions.

Release machinery, beta channels and previews

The workspace scripts show a release process tuned for a library embedded in a larger company's workflow, changesets with an ensure-changeset-config guard, a publish:beta channel, per-environment docs deploys for preview and staging, a post-PR report script, and a release:production script behind bash. The package releases on a biweekly-ish rhythm, 2.13.1 on September 3, 2.13.2 on September 8 and 2.14.0 on 2026-09-17, with the repository pushed 2026-09-28. The .opencode, .agents and skills directories beside AGENTS.md mark the AI-assisted development workflow the team runs, and the MIT license on a Cloudflare-authored library makes the whole system adoptable outside the company that built it.

Editorial conclusion

Use Kumo when building a React application that should match Cloudflare's design system, or when an accessible component foundation on Base UI with handled focus and ARIA is the requirement, and when the MIT license and granular imports fit your bundle discipline. Choose a more neutral design system when Cloudflare's visual language is not the goal. Before adopting, add the three peer dependencies, react, react-dom and the Phosphor icons package, import the styles entry once, prefer the per-component import paths for tree shaking, and use the kumo CLI's doc command to read component documentation without leaving the terminal.

Frequently asked questions

Official sources

1. cloudflare/kumo on GitHub
2. License: MIT
3. Project website
4. README
5. Releases