PrimeVue 是 Vue 3 上数据组件最丰富的 UI 库：DataTable、Tree、OrganizationChart 等复杂控件开箱即用，Aura 主题预设以祖母绿（#10B981）搭配石板灰；6px 圆角、轻阴影与 1px 表面描边保持现代观感，主题设计器支持 unstyled 与 pass-through 两种深度定制模式。适合数据密集型 Vue 中后台与可视化管理系统。
PrimeVue前端框架
提示词模板
基础模板
Design a PrimeVue-inspired interface. - Vue 3 components with the Aura theme preset; - Emerald #10B981 primary over a slate gray scale; - 6px radii, subtle shadows, 1px surface borders; - Rich data components: DataTable, Tree, OrganizationChart; - Theme designer with unstyled and pass-through modes. Colors: #10B981, #F8FAFC, #1E293B, #64748B with #10B981 accent. Typography: Inter.
变体提示词
📱 移动端
Design a mobile app with PrimeVue aesthetics. Use PrimeVue color identity with #10B981 accents. Clean, touch-friendly, native feel.
💻 Web端
Design a web application with PrimeVue style. Use PrimeVue color identity with #10B981 accents. Professional, responsive layout.
📊 仪表板
Design a dashboard with PrimeVue design language. Use PrimeVue color identity with #10B981 accents. Data-rich, organized, clear hierarchy.
📄 落地页
Design a landing page with PrimeVue visual identity. Use PrimeVue color identity with #10B981 accents. Compelling, conversion-focused.
使用示例
PrimeVue 数据表格仪表板
仪表板Build a data dashboard with PrimeVue style: DataTable with sorting and filters, stat panels, and #10B981 accent color.
PrimeVue 企业管理后台
Web 端Create an enterprise admin with PrimeVue design language: tree navigation, organization chart, and Aura theme surfaces.
✅ 适合场景
- Vue 3 项目
- 数据密集应用
- 企业仪表盘
❌ 不适合场景
- React 技术栈项目
- 追求极简视觉的轻量站点
DESIGN.md 文件
符合 design.md 开放格式的设计系统描述，可复制或下载后交给 AI 编程工具使用。