组件与代码

Canvas UI

开源创意组件库，用 WebGL/WebGPU 在实时 HTML 上叠加粒子、液态、玻璃等特效，框架无关。

react-google-charts

★ 1,722

轻量且类型完整的 React 图表组件，封装 Google Charts，支持 25+ 图表类型与动画。

spartan

面向 Angular 的无样式可访问 UI 原语库，基于 signals，支持 SSR 与 zoneless，样式可自由复制定制。

Hudl Uniform

Hudl 官方设计系统，涵盖颜色、按钮等组件规范与代码，确保界面风格统一。

Fluid Functionalism

一套开源 UI 组件，用弹簧物理、邻近悬停和字重过渡让动效服务于功能。

upload-crop-image

基于 shadcn/ui 的 React 图片上传裁剪组件，支持缩放、旋转、自由裁剪，集成 React Hook Form 与 Zod。

react-portal

React 组件，用于将模态框、灯箱等渲染到 document.body 或其他 DOM 节点，支持 SSR。

Tour Kit

React 无头引导与产品导览库，含导览、提示、清单、公告与微问卷，TypeScript 优先，无障碍友好。

Gamification UI Kit by Trophy

开源游戏化 UI 组件库，基于 shadcn/ui 和 Tailwind CSS，提供连续打卡、成就、排行榜、积分等 React 组件。

Metro UI

免费开源的前端组件库，含150+响应式组件、900+图标与零依赖JS工具，支持暗色模式。

Kitwind

基于 Tailwind CSS 的多用途响应式 UI 套件市场，含免费 Kometa 套件，提供 130+ 区块。

Twind

最小的 Tailwind-in-JS 方案，无需构建步骤，框架无关，运行时编译样式。

Atropos

轻量级开源 JavaScript 库，用于创建触屏友好的 3D 视差悬停效果，仅 2KB。

Cedar Design System

REI 开源的 Cedar 设计系统，提供可复用 UI 组件与视觉规范，含使用指南和代码。

KoliBri

德国联邦 IT 中心开源的、基于 Web Components 的无障碍 HTML 组件库，可多主题定制。

react-complex-tree

无预设样式的 React 树形组件，支持多选、拖拽、搜索与完整键盘无障碍操作。

react-dragula

dragula 的官方 React 封装，提供极简的拖放功能，API 与 dragula 一致。

stackzero/commerce-ui

基于 React、Next.js、Tailwind CSS 和 shadcn/ui 的电商组件库，可复制粘贴快速搭建电商网站。

shadcn-ui-storybook (fellipeutaka)

将 shadcn/ui 组件收录进 Storybook 的在线文档，可交互预览每个组件。

shadcn-storybook-registry

为 shadcn/ui 组件提供可直接安装的 Storybook 故事集合，覆盖 61 个组件与设计令牌。

useLayouts

免费动画 React 组件库，基于 Framer Motion 和 Tailwind CSS，可预览复制代码。

UI Layouts

面向 React、Next.js 与 TailwindCSS 的开源 UI 组件与区块合集，含 60+ 可定制组件。

Beautiful CSS buttons examples

92 个免费精美的 CSS 按钮示例，点击即可复制代码，直接用于网页项目。

Wind UI

基于 Tailwind CSS 的 React 与 HTML 组件库，提供 42 个响应式、无障碍组件，可直接复制粘贴使用。