shadcn.io:为 shadcn/ui 寻找新 blocks 的最佳去处
组件只是起点,真正能把整页一口气搞定的是 blocks。要找又新又能直接上线的 shadcn/ui blocks,shadcn.io 已经成了我们的最爱。这就来说说原因。
Dov Azencot
@DovAzencot如果你用 shadcn/ui 开发,那你早就领教过它的魔力了:代码归你所有。没有黑箱般的依赖要去对抗——你把一个组件复制进来,它就任你雕琢。
但组件只是小零件。一个按钮、一个输入框、一张卡片。真正吞掉时间的,是把这些零件拼装成 blocks——一个价格板块、一层仪表盘骨架、一个认证页面、一个功能网格。大部分工作(以及大部分「从旧项目里复制粘贴」)其实都发生在那里。
这正是 shadcn.io 填补的空白,也是我们把它当成首选的原因。
shadcn.io 是什么?
shadcn.io 是一个规模庞大、还在活跃成长的 blocks 注册表,构建在 shadcn/ui 之上——都是可以直接放进页面、拿去发布的完整、组合好的板块。不是基础组件,而是那种你自己动手搭要耗掉一下午的布局。
每个 block 都遵循和 shadcn/ui 本身一样的哲学:是归你所有的普通代码,用 Tailwind 做样式,没有运行时的绑定。你把它装进来,它就成了你代码库的一部分。
为什么它是寻找新 blocks 的最佳去处
有几点让它与众不同:
- 广度。 营销板块、仪表盘、表格、认证流程、价格、用户评价——这份目录覆盖了真实产品真正需要的页面,而不只是零星几个 demo。
- 够新。 新的 block 会定期上架,所以你用的是当下的模式,而不是一年前最后动过的东西。
- 是复制粘贴,而不是装完祈祷。 因为 block 是由 shadcn/ui 的基础组件组合而成的,读起来就像你自己会写的代码——好定制,也好套主题。
- 和注册表配合得很好。 block 直接嵌进你已经在用的那套 shadcn 工作流,没有什么新东西要学。
我们是怎么用它的
我们自己的流程很简单:从一个已经完成了 80% 的 shadcn.io block 起头,再把剩下的 20% 掰成契合品牌的样子。因为代码归你所有,最后那 20% 不值一提——换掉 token,调一调间距,搞定。它把「设计一个价格页」从一天变成了一个小时。
Neobrutalism ♥ shadcn.io
我们很自豪能和 shadcn.io 成为合作伙伴。如果你喜欢 Neobrutalism 对 shadcn/ui 的那套新粗野主义诠释,那你在他们的 block 库里也会宾至如归——一样的所有权模式、一样的 Tailwind 底子,覆盖的范围却广得多。
去 shadcn.io 逛逛这个合集,感受一下当 blocks 都已就绪时,一个页面能多快成型。