https://github.com/cloudflare/kumo
Cloudflare's component library for building modern web applications.
https://github.com/cloudflare/kumo
Last synced: 4 months ago
JSON representation
Cloudflare's component library for building modern web applications.
- Host: GitHub
- URL: https://github.com/cloudflare/kumo
- Owner: cloudflare
- License: mit
- Created: 2025-10-30T14:03:47.000Z (8 months ago)
- Default Branch: main
- Last Pushed: 2026-02-10T17:12:55.000Z (4 months ago)
- Last Synced: 2026-02-10T19:41:11.288Z (4 months ago)
- Language: TypeScript
- Homepage: https://kumo-ui.com
- Size: 19 MB
- Stars: 548
- Watchers: 2
- Forks: 20
- Open Issues: 30
-
Metadata Files:
- Readme: README.md
- License: LICENSE
- Agents: AGENTS.md
Awesome Lists containing this project
- awesome - cloudflare/kumo - Cloudflare's component library for building modern web applications. (TypeScript)
README
# Kumo
Cloudflare's component library for building modern web applications.
Kumo provides accessible, design-system-compliant UI components built on [Base UI](https://base-ui.com/). It handles keyboard navigation, focus management, and ARIA attributes so you can build accessible applications without thinking through every detail.
## Installation
```bash
pnpm add @cloudflare/kumo
```
### Peer Dependencies
```bash
pnpm add react react-dom @phosphor-icons/react
```
## Usage
```tsx
import { Button, Input, Dialog } from "@cloudflare/kumo";
import "@cloudflare/kumo/styles";
```
### Granular Imports (Tree-Shaking)
```tsx
import { Button } from "@cloudflare/kumo/components/button";
```
### Base UI Primitives
Kumo re-exports all Base UI primitives for advanced use cases:
```tsx
import { Popover } from "@cloudflare/kumo/primitives/popover";
```
## CLI
Query component documentation from the command line:
```bash
npx @cloudflare/kumo ls # List all components
npx @cloudflare/kumo doc Button # Get component docs
npx @cloudflare/kumo docs # Get all docs
```
## Development
See [AGENTS.md](./AGENTS.md) for comprehensive development documentation including:
- Component patterns and styling system
- Semantic color tokens
- Development workflows
- CI/CD pipeline
- Figma plugin
### Quick Start
```bash
pnpm install
pnpm dev # Start docs site at localhost:4321
pnpm --filter @cloudflare/kumo test
```
### Figma Plugin
```bash
# Optional: enable token sync during build
# cp packages/kumo-figma/scripts/.env.example packages/kumo-figma/scripts/.env
# $EDITOR packages/kumo-figma/scripts/.env # set FIGMA_TOKEN (and optionally FIGMA_FILE_KEY)
pnpm --filter @cloudflare/kumo-figma build
# In Figma: Plugins > Development > Import plugin from manifest...
# Select: packages/kumo-figma/src/manifest.json
```
### Creating Components
```bash
pnpm --filter @cloudflare/kumo new-component
```
## Documentation
- **Live Docs**: [kumo-ui.com](https://kumo-ui.com)
- **AI/Agent Guide**: [AGENTS.md](./AGENTS.md)
## License
MIT