Bar chart

When to use

• Comparing values across a small to medium number of categories (2–15 items)
• Showing response volumes by region, demographic group, or consultation option
• Displaying ranked results where relative size is the primary message
• Presenting survey results where each bar represents a response option

When not to use

• Don’t use for trends over time — use a line chart when the x-axis represents a continuous time series
• Don’t use with more than ~15 categories — the chart becomes hard to read; consider grouping or filtering instead
• Don’t use to show part-to-whole relationships — a stacked bar can do this, but a simpler option is often better (see Pie and donut)

Anatomy

• Bars — Each bar represents a single category value. Height (vertical) or length (horizontal) encodes the quantity.
• Axes — The categorical axis labels each bar; the value axis shows scale. Always start value axes at zero.
• Data labels — Optional values shown on or near bars. Use when exact numbers matter more than comparative shape.
• Legend — Required for grouped or stacked bars where colour distinguishes data series.
• Tooltip — Shows on hover/focus; provides the exact value for the hovered bar.

Variants

Vertical (column chart)

Default orientation. Best when category labels are short and the number of categories is moderate.

Horizontal

Use when category labels are long (e.g., place names, full question text) or when there are many categories that would crowd a vertical axis.

Grouped

Places bars for multiple series side by side within each category. Use to compare how two or three data series differ across categories.

Stacked

Layers bars for multiple series within each category bar. Use to show both the total and part-to-whole composition simultaneously. Avoid stacking more than four series.

Accessibility

• Colour alone is not enough — When using colour to distinguish series, also use pattern fills, direct labels, or legends with clear labels. See Colour in charts for colour-safe sequences.
• Provide a data table alternative — All bar charts should have an accompanying data table that screen reader users can access. This can be visually hidden but must be reachable via keyboard.
• Keyboard access — Individual bars should be focusable with keyboard. On focus, the bar’s category label and value should be announced via aria-label or tooltip.
• Don’t truncate axes — Starting a value axis above zero misleads users about the relative size of differences. Always start at zero unless the data range makes zero-based axes meaningless.