一、主流设计工具

Figma

基于浏览器的协作式设计工具，支持多平台同步、云端存储及实时协作，适合团队项目。

Pixso

提供一体化设计、交付、协作功能，支持云端协同办公，适合远程团队。

Sketch

macOS原生矢量编辑器，与Adobe系列兼容，支持插件扩展和代码导出，适合Mac用户。

二、AI辅助设计工具

Cursor

VS Code插件，智能代码补全、重构及上下文聊天功能，提升编码效率。

Motiff

AI布局工具，自动调整间距、边距及响应式设计，辅助快速生成结构化界面。

三、轻量级与高效工具

Vuetify/Quasar Framework

基于Vue.js的组件库，提供丰富的预制组件和响应式设计支持。

Tailwind CSS

原子化CSS框架，搭配Shadcn UI可实现快速主题切换和样式定制。

四、代码编辑与原型平台

CodePen

在线代码编辑器，支持HTML/CSS/JS实时预览，适合个人展示和代码学习。

Bolt.new

云端全栈开发平台，支持前后端一体化开发，浏览器即可完成项目构建。

五、其他实用工具

shadcn/ui：

开源设计系统库，集成Radix UI和Tailwind CSS，支持一键集成组件。

Uiverse：提供4000+免费开源UI组件，支持MIT协议商用，直接复制代码即可使用。

六、框架与库（补充）

Ant Design Vue/Element UI：主流企业级框架，适合中大型项目。

Tailwind CSS + Vue：组合方案，提升开发效率并保持设计灵活性。

选择建议：

团队协作优先选Figma或Pixso；

安卓/iOS设计可考虑Adobe XD或Sketch；

个人效率提升推荐Cursor或Motiff；

前端开发与设计结合使用Vuetify、Tailwind CSS等。