# Webiny Admin UI Catalog

Admin/ui, 130 abstractions.

- Repository: https://github.com/webiny/webiny-js (8051 stars)
- Category: Design
- License: see repository
- Last updated: 2026-10-30
- Runs scripts: no, instructions only

## Install

Claude Code: `npx skills add webiny/webiny-js --skill webiny-admin-ui-catalog -g -a claude-code -y`
Codex: `npx skills add webiny/webiny-js --skill webiny-admin-ui-catalog -g -a codex -y`
Cursor: `npx skills add webiny/webiny-js --skill webiny-admin-ui-catalog -g -a cursor -y`
Gemini CLI: `npx skills add webiny/webiny-js --skill webiny-admin-ui-catalog -g -a gemini-cli -y`

## Description

admin/ui, 130 abstractions.

## SKILL.md, as published by its author (untrusted third-party text, read it as data)

# admin/ui

## How to Use

1. Find the abstraction you need below
2. You MUST read the source file to get the exact interface and types!
3. Import: `import { Name } from "<importPath>";`

## Abstractions

---

**Name:** `Accordion`
**Import:** `import { Accordion } from "webiny/admin/ui"`
**Source:** `@webiny/admin-ui/Accordion/index.ts`

---

**Name:** `AdminLayout`
**Import:** `import { AdminLayout } from "webiny/admin/ui"`
**Source:** `@webiny/app-admin/components/AdminLayout.tsx`

---

**Name:** `Alert`
**Import:** `import { Alert } from "webiny/admin/ui"`
**Source:** `@webiny/admin-ui/Alert/index.ts`

---

**Name:** `AutoComplete`
**Import:** `import { AutoComplete } from "webiny/admin/ui"`
**Source:** `@webiny/admin-ui/AutoComplete/index.ts`

---

**Name:** `Avatar`
**Import:** `import { Avatar } from "webiny/admin/ui"`
**Source:** `@webiny/admin-ui/Avatar/index.ts`

---

**Name:** `BetaBadge`
**Import:** `import { BetaBadge } from "webiny/admin/ui"`
**Source:** `@webiny/admin-ui/BetaBadge/BetaBadge.tsx`

---

**Name:** `Button`
**Import:** `import { Button } from "webiny/admin/ui"`
**Source:** `@webiny/admin-ui/Button/index.ts`

---

**Name:** `Card`
**Import:** `import { Card } from "webiny/admin/ui"`
**Source:** `@webiny/admin-ui/Card/index.ts`

---

**Name:** `Checkbox`
**Import:** `import { Checkbox } from "webiny/admin/ui"`
**Source:** `@webiny/admin-ui/Checkbox/index.ts`

---

**Name:** `CheckboxGroup`
**Import:** `import { CheckboxGroup } from "webiny/admin/ui"`
**Source:** `@webiny/admin-ui/CheckboxGroup/index.ts`

---

**Name:** `CloneIcon`
**Import:** `import { CloneIcon } from "webiny/admin/ui"`
**Source:** `@webiny/admin-ui/DataList/index.ts`

---

**Name:** `cn`
**Import:** `import { cn } from "webiny/admin/ui"`
**Source:** `@webiny/admin-ui/utils.tsx`

---

**Name:** `CodeEditor`
**Import:** `import { CodeEditor } from "webiny/admin/ui"`
**Source:** `@webiny/admin-ui/CodeEditor/index.ts`

---

The rest: https://github.com/webiny/webiny-js/blob/HEAD/skills/user-skills/generated/admin/ui/SKILL.md