摘要:就在前几天,那个被称为「前端宝藏后花园」的Uiverse.io毫无预兆地甩出王炸:2.0 正式版上线,一次带来 3000+ 全新 UI 组件!
就在前几天,那个被称为「前端宝藏后花园」的 Uiverse.io 毫无预兆地甩出王炸:2.0 正式版上线,一次带来 3000+ 全新 UI 组件!
一句话:以后老板再说界面丑,直接把 Uiverse 2.0 甩他脸上!
类比数量Ant Design全部组件≈ 70Element Plus全部组件≈ 90Uiverse 2.0 新增3000+等于一口气给你 30 个主流组件库的素材量!而且清一色「别人家的按钮」——会呼吸、会发光、会扭腰。
随手挑 5 个本周最炸:
Button Mastery:毛玻璃 + 极光渐变,暗黑模式自动切换,苹果官网即视感。Voice Control:炫酷的音频语音控制效果,有种未来的感觉。Solid Metal:金属液态毛玻璃效果,特效满满。Joao Canais:纯 CSS 3D 加载旋转效果,网站一键炫酷。UI/EX Designer:动态卡片效果,交互效果满满。1. 设计师:Figma 里直接拖!
官方插件 Uiverse for Figma 同步 2.0 全部组件,拖进画板自动匹配样式 + 变量,再也不用「截图 → 吸色 → 手搓」。
2. 开发者:10 秒接入项目!
每个组件都给「框架级」导出:
React + TS 示例(复制即可运行)
// NeonButton.tsximport styles from './NeonButton.module.css';export const NeonButton = ({ children }) => ;Vue3 示例
体积?
官方强制 gzip
所有新组件默认 CSS 变量,品牌色 5 秒替换:
:root { --accent: #6366f1; /* 换你的主色 */ --surface: #ffffff; --text: #1f2937;}暗黑模式?媒体查询已写好,无需额外代码:
@media (prefers-color-scheme: dark) { :root { --surface: #0f172a; --text: #e2e8f0; }}动画卡顿? 全部改用 transform + opacity,再送 will-change。减少跳动? 优先使用 rem + clamp,大屏小屏都顺滑。** Accessibility?** 按钮自带 aria-pressed,加载器支持 prefers-reduced-motion。来源:不秃头程序员
