REGISTRY UI / 组件目录

组件

按分类浏览 registry 组件，查看预览、源码和安装命令。

17
组件
10
分类
17
JSON

基础

1

按分类组织，卡片顶部直接展示组件预览。

按钮示例
基础
一个紧凑的操作按钮组，用来验证最小可安装 registry 组件。
页面预览源码

表单

3

按分类组织，卡片顶部直接展示组件预览。

Sign in
Use your workspace email to continue.

Keep this form as source code and adapt it per project.

or

New team? Request access from your administrator.

登录表单
表单
由 Card、Field、Input、Separator 和 Button 组合成的登录表单。
页面预览源码
Search workspace
Filter reusable components, documents, or operational records.
128 items
搜索工具栏
表单
适合工作台页面的通用搜索和筛选工具条。
页面预览源码
Project settings
A form layout for product settings, account pages, and onboarding flows.
设置表单
表单
带输入框、选择器、文本域、开关、复选框和单选项的标签页设置表单。
页面预览源码

反馈

3

按分类组织，卡片顶部直接展示组件预览。

No components yet
Start your registry with one reusable block.
Add a component, document the install command, and verify it with shadcn add before publishing.
空状态
反馈
带语义操作和状态标记的可复用产品空状态组件。
页面预览源码
通知横幅
反馈
带有内联操作的紧凑提醒横幅。
页面预览源码
加载骨架
反馈
适用于表格型仪表盘和管理后台的通用骨架加载状态。
页面预览源码

布局

2

按分类组织，卡片顶部直接展示组件预览。

Workspace

Build a reusable product surface

Use this header for dashboards, settings pages, and internal tools that need a clear title, short context, and primary action.

页面标题区
布局
带上下文、说明和主要操作的通用页面标题区。
页面预览源码
Registry UIComponent workspace
Product
CN
Chen Ning
Design systems lead
Dashboard

Reusable interface system

A full application shell with navigation, breadcrumbs, summary cards, and user controls.

Components
42

12 ready for release

Installs
1.8k

Across active projects

Coverage
96%

Preview and source checks

Release activity
Registry build completed and install verification passed.
应用外壳
布局
带侧边栏导航、面包屑、操作、指标卡和用户控制的应用页面框架。
页面预览源码

数据展示

2

按分类组织，卡片顶部直接展示组件预览。

Active users
24,892
+12.4%

Compared with the previous period

指标卡片
数据展示
适用于仪表盘和概览面板的紧凑 KPI 卡片。
页面预览源码
Members
A compact table for admin lists, ownership reviews, and account pages.
3 selected
MemberRoleStatusPlanLast activeOpen row actions
AB
Avery Brooksavery@example.com
OwnerActivePro2m ago
MP
Mina Parkmina@example.com
DesignerInvitedTeam1h ago
NC
Noah Chennoah@example.com
EngineerActiveProYesterday
数据表格
数据展示
带选择、行操作、状态标记、头像和分页的管理表格。
页面预览源码

内容

2

按分类组织，卡片顶部直接展示组件预览。

System
Library building blocks
Use this pattern for feature summaries, capability lists, or onboarding sections.

Composable blocks

Ship source-level components that can be edited in every consuming app.

Registry output

Build installable JSON artifacts that shadcn CLI can consume by URL.

Preview first

Keep a visual workbench so humans and AI tools can inspect available UI.

功能列表
内容
适用于产品概览和引导说明的三列功能列表。
页面预览源码
Workflow
Publish checklist
Use this pattern for onboarding, release flow, or setup progress.
1

Design the block

Done

Compose existing primitives and keep the public props small.

2

Build registry JSON

Generate installable artifacts for every component item.

3

Verify installation

Install into a clean app before sharing the registry URL.

步骤列表
内容
适合安装、引导和发布流程的结构化步骤清单。
页面预览源码

操作

1

按分类组织，卡片顶部直接展示组件预览。

Quick actions
Group common commands in a compact panel for dashboards and admin pages.
3 actions

Keep actions close to the workflow they support.

操作面板
操作
适合承载重复工作流操作的紧凑命令面板。
页面预览源码

商业

1

按分类组织，卡片顶部直接展示组件预览。

Team
For small product teams that need shared UI blocks.
Popular
$29per seat / month
  • Registry installs
  • Preview workspace
  • Shared component notes
价格卡片
商业
带功能亮点和主操作的通用套餐卡片。
页面预览源码

人员

1

按分类组织，卡片顶部直接展示组件预览。

CN
Chen Ning
Available

Design systems lead

Owns component quality, preview coverage, and reusable product patterns.

RegistryPreviewQA
资料卡片
人员
适合团队成员、负责人和账号信息的紧凑资料卡。
页面预览源码

浮层

1

按分类组织，卡片顶部直接展示组件预览。

确认弹窗
浮层
由 Dialog、Button 和 Badge 组合成的危险操作确认弹窗。
页面预览源码