组件与代码
共 1000 个设计师推荐的组件与代码网站。
King Design
金山云出品的企业级设计系统，提供多框架高质量组件库与设计资源。
Liquid Metal
实时 WebGL 液态金属着色器效果，为按钮和 UI 组件添加动态金属边框，含三种预设。
动效组件Vengeance UI
面向 React/Next.js 的动效组件库，提供悬停位移、动画提示与滚动驱动布局等独特交互。
React Photo Album
React 响应式照片画廊组件库，支持行、列、瀑布流三种布局，开箱即用。
动效组件Gooey
为 React 打造的液态 UI 动效库，元素接触时像黏液般融合、如果冻般变形，文字保持清晰。
shadcn-tree-view
基于 shadcn/ui 的树形视图组件，支持层级数据展开折叠、拖拽与自定义图标。
代码片段 / CSS 效果CSSnippets
300+ 可直接复制的 HTML、React、CSS 与 Tailwind 组件代码片段，涵盖按钮、卡片、表单等。
Auro Design System
阿拉斯加航空开源的企业级设计系统，提供设计令牌、Web Components 与样式工具，跨平台统一 UI。
shadcn-cookie-consent
基于 shadcn/ui 和 Tailwind CSS 的可定制 Cookie 同意横幅组件，支持多种样式变体。
react-sizeme
让 React 组件感知自身宽高的轻量库，支持渲染属性与高阶组件，性能好、体积小。
动效组件NumberFlow
一个无依赖、可访问的 React 数字动画组件，支持数字变化时的平滑过渡与格式化。
Onborda
基于 Framer Motion 和 Tailwind CSS 的 Next.js 产品引导流程库，支持多步骤、多导览和自定义卡片。
Tailblocks
开箱即用的 Tailwind CSS 区块集合，复制粘贴即可快速搭建页面。
Svelte UX
基于 Svelte 和 Tailwind 的组件库，提供组件、动作、状态与工具，用于构建高交互应用。
Shineout
高性能 React 组件库，API 简洁友好，支持灵活主题定制，向后兼容。
动效组件hamburger-react
轻量级 React 汉堡菜单图标库，提供多种 CSS 过渡动画，体积仅约 1.5KB。
DropDrawer
为 shadcn/ui 打造的自适应组件，桌面端显示下拉菜单，移动端自动切换为抽屉，开箱即用。
Grid
一个基于 React 和 Tailwind 的 12 列网格系统，提供类型安全的响应式布局组件。
JolyUI
基于 shadcn/ui 的可复制粘贴 React 组件库，用 Tailwind CSS 与 Motion 打造，动画流畅且无障碍。
mindmapcn
基于 Mind Elixir 的思维导图组件，用 Tailwind 样式，与 shadcn/ui 无缝兼容，零配置开箱即用。
scificn-ui
复古科幻风 React UI 组件库，荧光屏终端美学，含 HUD、数据网格等模块，兼容 shadcn CLI。
组件库shadcn-country-dropdown
基于 shadcn/ui 的国家选择下拉组件，符合 ISO 3166 标准，支持搜索和国旗显示。
Shadcn Font Picker
基于 shadcn/ui 与 Google Fonts API 的 React 字体选择器组件，支持搜索与实时预览。
Oversight Supply
Oversight 出品的免费网站区块库，提供 Webflow 与 Framer 模板中的独立区块，可预览并复制到 Claude Code、Cursor、v0 等工具。