Chart Prompts

1,337 ways to dress a line or bar chart, 669 light and 668 dark. Open any chart to see it full size and copy a prompt that gives your own chart the same look.

Every chart uses illustrative data. The prompts work with any coding agent and any charting library; they describe colors, type, spacing and marks precisely enough to reproduce each look.

← More from Emergent Mind Labs

Negative Space bar chart, dark theme: Hollow white-outlined waterfall bars on pure black, with one solid white total.

Negative Space

DarkBar

Hollow white-outlined waterfall bars on pure black, with one solid white total.

  • Black#000000
  • White#FFFFFF
  • Grey#8A8A8A

Prompt for your coding agent

Paste it with your chart's code. It restyles your data to match this chart.

Restyle my chart in the "Negative Space" style described below. Keep my data, chart type, title meaning and units; change only the presentation. Use the charting library this project already uses (plain SVG if there is none). If the library can't express a detail, draw it in a custom layer instead of dropping it. Measurements assume a 960 x 600 chart; scale them proportionally.

Mood: a theater program printed white on black. Bars are drawn as hollow outlines, the black does most of the work, and a single solid white shape anchors the eye.

Colors (use these exact values):
- Background: #000000.
- All marks and main text: #FFFFFF. Secondary text and brackets: #8A8A8A.
- No other colors. Increases and decreases are told apart by "+" and "−" glyphs, never by color.

Typography (Google Fonts): Sora 300 (light) and 600 (semibold).
- Eyebrow: 300, 12px, uppercase, 4px letter-spacing, #8A8A8A.
- Title: 600, 30px, uppercase, 5px letter-spacing, white, stating the finding.
- Subtitle: 300, 14px, #8A8A8A, with measure, unit and period.
- Category labels: 300, 11.5px, white, centered under each bar (the final total in 600).
- Values: 600, 13px (the opening value 14px, the closing total 18px). Group bracket labels: 300, 11px, uppercase, 2.5px letter-spacing, #8A8A8A.
- Source: 300, 11px, #8A8A8A, top right.

Layout:
- Generous empty margins: 56px sides, title block in the top 140px, plot from about y = 176 to a baseline at y = 486.
- Bars take 56% of each band. Under the category labels, thin 0.75px #8A8A8A brackets (5px tall ends) group the increases and the decreases, labeled with their sums ("INCOME +4.60", "SPENDING −4.68").

Axes and grid:
- No gridlines and no y axis. A single 1px baseline in white at 50% opacity.

Marks:
- Bar chart (waterfall): every bar is a 1.5px #FFFFFF outline with no fill, square corners. The opening bar rises from the baseline; each change floats from the previous running total; only the closing total bar is filled solid #FFFFFF. Thin dotted connectors (1px white, dash 1 3) run from each bar's end level to the next bar. Increase values sit 10px above their bars as "+2.85"; decrease values sit 22px below their bars as "−2.10" using the true minus sign. For plain bar charts: hollow outlined bars, with only the single most important bar filled.
- Line chart: a 1.5px white line with hollow 5px circles (1.5px white stroke, black fill) at each point, and only the final point filled solid white and labeled in 18px 600. Increases and decreases between points can be marked with small "+" and "−" value labels.

Avoid: color, fills other than the one anchor, gridlines, gradients, glows, rounded corners, and crowded margins.

When you're done, render the chart and check that the running totals add up to the closing value, exactly one mark is filled, every connector meets the bar edges, and the minus glyphs are true minus signs.