Chart

About the Neo-Brutal Chart

A line, area or bar chart in SVG with HTML labels, so text never stretches with the fluid width. Area: the first series is a solid cobalt fill under a 2.5 px ink stroke, further series are strokes; a band is a hatched volt forecast range under an ink outline; the marker is a volt dot on a dashed ink line with an ink label chip; dashed grid lines and mono labels on the right. Bars are ink-outlined, the marked bar volt. Lines and areas clip open from the left on reveal; bars rise with the pop. Always pass label, and summary when the trend matters. The plot box carries data-plot, which Crosshair reads. A series may stop before the labels end (today) while the band runs on to the month's end.

It is part of Neo-Brutal. The style’s 92 pieces share one set of tokens, type and motion, in a light and a dark theme, so whatever you take from it fits together.

To put it in your project, copy the prompt into Claude Code, OpenAI Codex or Cursor, or add the file and its styles by hand. The documentation walks through both.