# uiuno

> A browser-based visual workspace for building, organizing, and sharing shadcn/ui components and design systems, with a live code editor and preview, registry management, and distribution to teams and AI agents.

uiuno is a browser-based workspace for building, organizing, and sharing shadcn/ui components and design systems. It pairs a live code editor with an instant preview so you can write a component and watch the rendered result update beside it. Finished work can be forked, published publicly, and distributed to teammates, AI agents, and the wider community.

## What It Is

The homepage positions uiuno as a shadcn/ui workspace "for humans and AI agents." The interface is split between a TypeScript/TSX editor on one side and a live rendered preview on the other, with collections of components shown in list, card, or pack views. Rather than scaffolding a project locally, you assemble and preview shadcn/ui components in the browser and then push them out through the standard shadcn registry and CLI flow.

## Editor and Live Preview

The editor surface includes a file tab (for example, an `example.tsx` entry), a preview pane that re-renders on save, and quick actions to fork a workspace or open the code in Cursor. The homepage marketing also shows visual touches such as shader effects on save. A TanStack option is available for exporting or pulling a template into that stack.

## Design Systems and Tokens

uiuno includes a design-system panel covering base tokens, component tokens, typography, color palettes, and icons, along with a set of prebuilt default systems such as shadcn/ui Amber, Blue, Cyan, and Emerald. According to the maker's announcement, the design-system feature is modeled after the DTCG token standard and translated into shadcn/ui plus Tailwind CSS, with support for custom token names and importing from Figma.

## Registries and Distribution

A shadcn directory lets you browse community-maintained registries and add items into your collection, and the workspace surfaces the shadcn CLI install flow for sharing components. The stated goal is distributing components and design systems to a team, to AI coding agents, and publicly, which lines up with the public/private and fork controls visible in the workspace.

## Dependencies and Styling

The workspace bundles an npm dependency manager, a shadcn/ui dependency view, and Tailwind CSS management split across imports, base, components, utilities, and animations. Custom CSS entered in the editor is parsed into registry JSON on the fly, and the footer exposes formatting via Prettier and an "anti-slop" mode aimed at cleaner output.

## Features
- Side-by-side code editor with live rendered preview
- Build and organize shadcn/ui components in the browser
- Reusable design systems with base and component tokens
- Prebuilt default design systems and color palettes
- Figma import for design tokens
- Community shadcn registry directory to browse and add items
- Component and design-system distribution via the shadcn CLI
- npm dependency management
- Tailwind CSS management for imports, base, components, utilities, and animations
- Custom CSS parsed into registry JSON
- Fork and publish components publicly or keep them private
- Open in Cursor
- Prettier formatting and anti-slop mode

## Integrations
shadcn/ui, Tailwind CSS, Figma, Cursor, TanStack, npm

## Platforms
WEB

## Pricing
Free

## Links
- Website: https://uiuno.com
- EveryDev.ai: https://www.everydev.ai/tools/uiuno