For AI Agents
Hand your agent this brief or the ReUI MCP, not a screenshot. Installs with a ReUI Pro or Ultimate license.
When to use
- Values compared across hours, days or categories as grouped, stacked or hatched columns
- Run durations or event volumes against a timeout or limit line, with outcome toggles
- Segmented meters that split a capacity, a fund or a heart rate zone into colored slices
When not to use
- A share of a whole where the slices read better around a ring: use the Pie Chart blocks
- A progress reading shown as an arc gauge with a status label: use the Radial Chart blocks
- Rows of jobs or deploys, each with its own run history strip: use the Status Tracker blocks
Agent notes
Chartrenders with no props, so every bar, meter value and limit comes from constants kept in the block folder
Markdown
https://reui.io/blocks/chart/bar-chart.mdMCP
search({ query: "bar chart", type: "block", category: "bar-chart" })Shadcn Bar Charts, From Grouped Columns to Segmented Meters
Bars compare values: categories against each other, hours against a limit, or one slice of a capacity against the rest. This category covers all 3, from a grouped freight comparison to hourly columns stacked by outcome and meters that split a total into segments.
Most blocks draw with the shadcn Chart wrapper over Recharts, with ToggleGroup chips, a Select or readouts above the bars. The distribution bar, the heart rate zone meter, the allocation meter and the firewall pill grid are plain elements, because they are segments rather than plotted values.
All Bar Chart Blocks
Open any block on its own page for a live preview, the components it is built from, and the install command.
- Fund Distribution Capital Inflows fund breakdown card with segmented distribution bar and range filter
- Heart Rate Zones Heart rate metric card with segmented zone bar and large bpm readout
- Portfolio Allocation Portfolio Allocation Card with Week/Month/Year Tabs and Segmented Bar Meter
- Capacity Usage Operational KPI metric cards with segmented bar gauge for utilization and capacity tracking
- Inventory Velocity Inventory velocity bar chart card with diagonal hatched bars and dotted backdrop
- Freight Transit Times Grouped air vs sea freight bar chart with hover-dimmed bars and live region readout
- Cron Runner Load Hourly runner time stacked bar chart with outcome toggles and a timeout burn callout
- Cron Run Durations Cron job run duration bars with status tones, a timeout line and a Run now toolbar
- Audit Log Volume Audit log event volume chart with stacked outcome pills, drag range selection and denial avatars
- Firewall Traffic Hourly firewall traffic pill grid with a threats toggle, scrubbing readout and incident markers
- Error Budget Burn Error budget burn-down with daily lollipop stems, an SLO picker and a budget ribbon
- SLO Burn Rate SLO burn rate panel with hourly log scale lollipops, window tracks, alert rules and mute
- Data Sync Activity Hourly data sync activity chart with hatched outcome columns and a Runs or Rows toggle
- Sync Run History Connection sync history card with hourly outcome columns and a recent runs list
What These Bar Chart Blocks Cover
- Grouped and hatched columns Warehouse turnover in diagonal hatched bars over a dotted backdrop, and air versus sea freight grouped bars that dim the others on hover with a live region readout.
- Hourly stacked outcomes Cron runner time, audit log events, firewall traffic and data sync runs stacked by outcome per hour, with toggles that hide an outcome and readouts above the bars.
- Limits and lollipops Run durations under a dashed timeout line, and SLO error budget lollipops that hang below 0% once overspent or sit on a log axis for burn rate.
- Segmented bar meters A fund distribution bar, a heart rate zone meter, a vertical allocation meter and 40-segment utilization gauges.
Related Shadcn Chart Categories
- Area Chart Area chart cards with gradient fills, stacked series, period tabs and hover tooltips for trends over time.
- Composed Chart Composed charts that layer areas and lines on one axis, with reference lines, goals and release markers.
- Line Chart Line chart cards with single and multi-series lines, dual axes, reference lines and metric switchers.
- Pie Chart Pie and donut chart cards with center totals, per-segment legends and period tabs for share of a whole.
- Radial Chart Radial gauges with semicircle and full arcs, segmented rings and status labels for progress toward a target.
- Sparkline KPI tiles and metric lists where each value pairs with a small line, area or bar sparkline and a delta.
- Status Tracker Per-row status trackers for run history, deploy stages and pipelines, with hover details and filters.
- Stats Number-first KPI strips for when the metric leads and a trend line would only be decoration.
- Dashboard Full overview screens that combine a metric row, a chart layer and a data grid into one page.
All Shadcn Block Groups
Browse the full ReUI Shadcn blocks library by product surface. Each group bundles category-level blocks you can mix and match across your project.
- Shadcn Application Blocks (301) Browse 301 Shadcn Application blocks across 23 categories.
- Shadcn Data Grid Blocks (42) Browse 42 Shadcn Data Grid blocks across 9 categories.
- Shadcn Charts Blocks (47) Browse 47 Shadcn Charts blocks across 8 categories.
- Shadcn Solutions Blocks (74) Browse 74 Shadcn Solutions blocks across 10 categories.
- Shadcn AI & Agents Blocks (18) Browse 18 Shadcn AI & Agents blocks across 2 categories.
- Shadcn eCommerce Blocks (87) Browse 87 Shadcn eCommerce blocks across 13 categories.
- Shadcn Marketing Blocks (67) Browse 67 Shadcn Marketing blocks across 8 categories.
Frequently Asked Questions
Which bar chart blocks use Recharts?
Most of them, through the shadcn Chart wrapper. The fund distribution bar, the heart rate zone meter, the allocation meter and the firewall pill grid are built from plain elements, so they carry no chart dependency at all.
Can I change the timeout or SLO line?
Yes. Those lines are a Recharts ReferenceLine whose value comes from the block's data, so pointing one at your own threshold is a single edit.
Start building with ReUI Pro today.
Every Pro block, every style, and every future addition, with one license for unlimited projects.
Get All-Access
From $249, once. Lifetime updates.