$4.99深色平衡图表界面组件
用于展示流入、流出及净结余的深色图表区块，并明确标注报告周期。以清晰的浅色标签和克制的青绿色、陶土色区分数据，同时说明图表展示的是总额构成还是随时间变化的余额。
双系列柱状图界面组件
用于比较少量类别中两组指标的可复用双系列柱状图区块。暖深陶土色表面、青绿色与陶土色柱形及清晰标签，适合管理层报告和精致的产品页面。
你会得到
- 一个响应式图表区块，清楚标明两组数据
- 共享的零起点刻度、类别标签和易读数值
- 与图表样式分离、便于编辑的内容数据
- 无障碍标签和简洁的数据结论
适合
- 比较本期与上期指标的管理层摘要
- 按功能类别展示两项指标的产品页面
- 按渠道比较营销活动效果的报告
不适合
- 需要交互探索的长时间序列或密集数据
- 单位或尺度不兼容、无法直接比较的数据
你需要提供
- 类别相同且已命名的两组数值
- 比较所用的单位和报告周期
运行要求
- A modern browser
- Node.js 20+ for the validator
运行成本
No external services. Runs entirely on your agent.
试试这个提示词
/sl-paired-column-chart-ui-block 制作一个用于报告的 Q2 渠道绩效区块，展示 Referral、Search 和 Direct 三个渠道的合格线索与转化账户数量。使用标题“Q2 channel performance”，并显示“Qualified 148 · Converted 126”、“Qualified 120 · Converted 84”和“Qualified 96 · Converted 72”。保持 Teal Clay Ledger 风格。
后续提示词
- 添加数据来源说明和简洁的比较周期标签。
- 检查 390px 布局，确保系列名称和准确数值可见，且无需缩小 SVG 文字。
验证情况
已验证
| render-check | pass | 4.0 / 5 | 18s |
常见问题
图表适合展示多少个类别？
建议使用三到六个类别，让成对柱形和标签保持清晰。类别更多时，请选择更适合密集数据的图表或提供单独的详情视图。
两组数据可以使用不同单位吗？
不可以。双系列柱状图默认使用同一尺度进行直接比较。请先转换为共同单位，或改用其他图表。
组件在手机上也能使用吗？
可以。窄屏时按类别纵向排列，每组用两条横向柱形展示，并以正常字号显示系列名称和准确数值；不能只依赖缩小的 SVG 文字或无障碍文本。
相似技能
$4.99
$4.99Event Bar Chart（界面组件）
用于产品页面和报告的可复用事件对比图表区块，包含按数值成比例的横条、清晰的直接标注、周期说明和简洁结论。
$4.99电子表格数据网格
适用于产品界面、管理报告和研究发布的可复用数据网格区块。暖纸色背景、可操作且易于访问的控件与对齐的等宽数值，让密集记录更易浏览。
$4.99记录数据网格界面组件
用于报告与产品界面的可复用记录网格，以暖中性色表面和清晰的青绿色重点呈现信息。适合需要快速查看负责人、状态和记录详情的场景。
免费Activity Calendar Chart（界面组件）
制作可复用的活动日历图表区块，让每日变化一目了然。温暖中性的编辑风格以墨色画布、陶土色表面和青绿色强度单元格呈现产品分析与管理层报告。
$4.99单屏主视觉界面组件
制作一个可复用的单区块产品主视觉，采用温暖纸感底色、克制的边框和低调的青绿色主操作按钮。适合需要精致、偏编辑风格的首屏，但暂时不需要完整落地页的创始人与产品团队。
$4.99倾斜画廊主视觉
可复用的产品发布首屏组件，将简洁文案与经过编排的倾斜摄影画廊结合。适合暖中性色品牌，突出动感影像、清晰对比与响应式布局，同时避免套用整页模板。
$4.99集成网格主视觉组件
可复用的产品主视觉组件，将清晰的发布信息与易于浏览的集成网格结合。温暖中性色与克制的青绿色点缀，适合需要展示生态广度、同时保持信息清晰的软件发布页面。