Skills
.Work. You
Rest

Using @umami/react-zen

Official

Build fast, accessible UIs with Zen.

Software Engineering#theming#accessibility#react#tailwind#dark-mode#component-library#zen
Authorumami-software
Version1.0.0
Installs0

System Documentation

What problem does it solve?

Zen provides a prop-driven React UI toolkit that lets you build polished interfaces without writing HTML, CSS, or managing Tailwind utilities, accelerating development while ensuring a cohesive design system.

Core Features & Use Cases

  • Prop-driven components: Style and configure UI using component props instead of class names.
  • Design system included: Built-in theming with dark mode and accessible primitives.
  • Use case: Rapidly assemble dashboards, forms, and layouts with consistent visuals and behavior.

Quick Start

  1. Install the package: npm install @umami/react-zen
  2. Import styles in your app entry: import '@umami/react-zen/styles.css';
  3. Wrap your app with ZenProvider and start using components like Box, Text, and Button.

Dependency Matrix

Required Modules

None required

Components

Standard package

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: Using @umami/react-zen
Download link: https://github.com/umami-software/react-zen/archive/main.zip#using-umami-react-zen

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 223,000+ vetted skills library on demand.