最独特的基于 ShadCN 的 UI 库!

发布: (2026年1月17日 GMT+8 23:34)
3 min read
原文: Dev.to

Source: Dev.to

概览

如果你已经厌倦了千篇一律的网页、布局、组件以及 AI 生成的废话,来看看这些能够让你的项目脱颖而出的 UI 库吧。最棒的是,它们都可以很好地配合 shadcn/ui 使用,轻松嵌入已有项目。

1. 8bitcn/ui

8bitcn/ui – 由传奇网页战士 Orc Dev 打造的复古像素艺术风格 UI 库。

8bitcn Screenshot

亮点

  • 像素风格的按钮、卡片和 UI 基元。
  • 强烈的复古游戏氛围。
  • 完全开源,配有酷炫的区块。

2. RetroUI

RetroUI – 一款新粗野主义 UI 库,毫不掩饰地拥抱大胆设计。你会看到大胆的排版、鲜艳的高对比色以及随处可见的厚重暗影。

RetroUI Screenshot

亮点

  • 组件手感十足,交互有趣。
  • 主题支持,让你可以将粗野主义外观适配到品牌风格。
  • 专业支持,提供模板和 Figma 资源包。

3. Elements

Elements – 超越视觉,提供完整的 shadcn/ui 全栈区块,开箱即用的 UI 与功能。

Elements Demo

它已经内置了诸如 Vercel AI SDK、Polor 支付、Uploadthing 等流行集成,更多功能即将上线。

Elements 与众不同之处

  • 预构建区块包含业务逻辑,而不仅是视觉效果。
  • 覆盖常见模式,如身份验证、支付和 AI 集成。

4. Glass UI

Glass UI – 完全聚焦于玻璃拟态的库,提供磨砂玻璃卡片、模糊背景和半透明面板,拥有柔和的高光与层次感。

Glass UI demo

如果你喜欢 Apple 的设计语言,并希望在网页上实现 SwiftUI 风格的视觉效果,Glass UI 值得一试。

5. Wiggle UI

Wiggle UI – 首个面向网页的 手机风格小部件集合。想象一下 iOS 与 Android 主屏幕小部件,你可以直接将它们嵌入网站或 Web 应用。

Wiggle UI Demo

Wiggle UI 的独特之处

  • 精选的可复制粘贴小部件集合。
  • 灵感来源于 iOS 手机小部件。
  • 设计为直接放入项目中使用。
  • 包含多种变体(天气、时间、体育、媒体等)。

最后感想

shadcn/ui 为你提供了坚实的基础,而这些库则能为你的项目注入独特的个性。祝你构建愉快 🚀

Back to Blog

相关文章

阅读更多 »

构建 Tailwind CSS 下拉菜单

构建 Tailwind CSS 下拉菜单 !用于构建 Tailwind CSS 下拉菜单的封面图片 https://media2.dev.to/dynamic/image/width=1000,height=420,fit=cover...