Dashboard
仪表盘统计卡片
一个仪表盘统计卡片，包含图标、数值、变化百分比和迷你图。
作者：mcpSkills
框架
nextjs
UI 库
shadcntailwind
难度beginner
英文提示词
Create a dashboard statistics card component. It should display: an icon (use Lucide icons), a label, a main value (large number), a change percentage (with green for positive, red for negative), and a small sparkline chart at the bottom. Use shadcn/ui Card component and Tailwind CSS. Make it responsive and include hover effects.
中文提示词
创建一个仪表盘统计卡片组件。应显示：图标（使用 Lucide 图标）、标签、主数值（大号数字）、变化百分比（正值绿色，负值红色），以及底部的小型迷你图。使用 shadcn/ui Card 组件和 Tailwind CSS。使其响应式并包含悬停效果。
概述
一个可复用的统计卡片组件，非常适合仪表盘布局。显示关键指标并提供趋势的视觉指示器。
功能特性
- 图标支持（Lucide 图标）
- 大号、易读的数值显示
- 颜色编码的变化百分比
- 集成的迷你图
- 悬停动画
- 响应式网格布局
使用方法
将提示词复制到你的 AI 工具中。该组件在仪表盘页面的网格布局中表现出色。
变体
修改提示词以：
- 添加时间范围选择器（7天、30天、90天）
- 包含详细分解的工具提示
- 添加与上一时期的比较
- 支持不同的图表类型（柱状图、面积图）