Bar chart maker

Make a bar chart by typing your categories and values: bars on a scale with round numbers, their values on top, and a line for a target or a trend if you add one. It opens with monthly sign-ups for two years against a target.

Type the data

Double-click the chart to edit it beside a live preview. It starts with "xychart-beta", then:

x-axis [Jan, Feb, Mar]: the categories, with a title first if you like: x-axis "Month" [Jan, Feb, Mar]
bar [120, 150, 170]: a value per category
bar "2026" [180, 210, 260]: a second series sits beside the first, named in the legend
line "Target" [200, 220, 240]: a line with a point per category
y-axis "Sign-ups" 0 --> 400: the value axis title and range, both optional

Across or up

"xychart-beta horizontal" lays the bars across, with the categories down the left: easier to read when the labels are long, such as product names or countries. Negative values go below or left of the zero line.

A scale that reads well

The value axis runs from zero to a round number above the largest value, with gridlines at even steps (20, 40, 60…), unless you set the range yourself. With one series, each bar shows its value; with several, a legend names them.

Mermaid syntax

This is Mermaid's XY chart syntax, so charts from Markdown documentation paste straight in and yours can go back into a README. Lines that can't be read are listed under the editor.

Questions

How do I make a line chart?

Use line instead of bar: line "p95" [240, 260, 230]. Several lines can share a chart, and lines and bars can be mixed, such as actual values as bars and the target as a line.

Can I stack the bars?

Not yet: series sit side by side, grouped by category.

How do I get the chart into a slide?

Export it as PNG or SVG, or copy it as an image and paste it. It is saved in your browser and can be shared as a link.