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

Waitlist Length line chart, light theme: Housing authority page: program sidebar, slim wait panel and a thick slate line.

Waitlist Length

LightLine

Housing authority page: program sidebar, slim wait panel and a thick slate line.

  • Report gray#F7F7F5
  • Sidebar#ECECE7
  • Slate blue#475B8C
  • Issuance green#16A34A
  • Wait gray#8A8F98

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 "Waitlist Length" 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 page from a public housing authority's annual report. Plain, trustworthy and organized: a context sidebar on the left, one heavy primary line, quiet secondary information and no decoration.

Colors (use these exact values):
- Page: #F7F7F5 (soft gray-white). Sidebar panel: #ECECE7, full height, with a 6px #475B8C bar across its top edge.
- Primary series and brand color: #475B8C (slate blue).
- Event markers (issuances, releases, openings): #16A34A (green).
- Secondary series (in its own slim panel): #8A8F98 (neutral gray).
- Ink: #1F2430. Secondary text: #5F6570. Gridlines and rules: #D8D8D2. Inactive sidebar markers: #B9BDC6.

Typography (Google Fonts):
- Merriweather Sans for everything. Title 800, 29px, -0.4px letter-spacing, ink, stating the finding with the computed change ("Voucher waitlist up 71% in eight years").
- Section eyebrow above the title: 700, 11px, uppercase, 1.8px letter-spacing, slate.
- Subtitle 400, 13.5px, #5F6570, naming both measures, their units and the period.
- Sidebar: organization name 800 15px uppercase 2.4px letter-spacing in slate, a second line 700 11px uppercase in #5F6570; a "PROGRAM TYPES" label 700 11px uppercase followed directly by an italic 300 11px scope note saying which item is charted and that the rest are context; each item a 13px 700 name (slate for the charted item, #5F6570 for the rest) with two 12px 300 description lines.
- Axis labels 11.5px; year labels 700 12px ink; value callouts 800 15px slate.

Layout:
- Left sidebar 252px wide holding the organization, a 1px rule, the heading and scope note, and 3 to 5 program or category descriptions, each with a 4 x 52 px vertical marker (slate for the category charted, #B9BDC6 for the rest). The sidebar is context, never a legend: only the charted item may use a series color. "Source: illustrative data" at 11px sits at the bottom of the sidebar.
- Chart area from x 300 to 868: eyebrow at y 54, title at y 92, subtitle at y 118, a one-row legend at y 152, then two panels on one time axis: a slim secondary panel from y 186 to 262 and the primary panel from y 298 to 486, then a one-line explanatory note at y 572.

Axes and grid:
- Never a right-hand second axis. Each panel has its own left axis, unlined, labels right-aligned 10px from the plot edge: the primary panel in the primary unit (thousands separators) in #5F6570, the slim panel (e.g. 0, 20, 40 months) in #8A8F98. Both start at zero.
- Horizontal 1px #D8D8D2 gridlines at each tick; a 1.2px ink baseline under the primary panel and a 1px gray zero line under the slim panel.
- Time axis: years centered under their quarters in 700 ink at 42px below the baseline, separated by 1px #D8D8D2 vertical dividers 30px long hanging below the baseline.

Marks:
- Line chart: the primary series is a 5px slate line with round caps and joins, straight segments, over a 7% slate area fill. Open start dot (r 5, page fill, 3px slate ring) and solid end dot (r 6.5 slate, 2px page ring), both labeled in 800 15px slate ("4,120 households"). The secondary series is a thin 1.5px #8A8F98 line in the slim panel with its first value above its start and its last value ("31 months") below its end in 700 12px gray. Events are 3px wide, 16px tall green ticks hanging just below the baseline, each labeled with its count in 700 10.5px green to its right.
- Bar chart: square-cornered slate bars about 60% of the band on the same #F7F7F5 page, the secondary measure as the thin gray line with dots in its own slim panel above, and events as the same green baseline ticks. Label the first and last bar in 800 slate.

Legend: a single row above the panels: a thick 26px slate stroke, a thin gray stroke and a green tick, each with a plain 12px label naming the measure.

Avoid: markers on every point, gradients, shadows, rounded bars, bright colors other than the event green, dual axes, and a sidebar list that could be mistaken for a legend.

When you're done, render the chart and check that the title's percentage matches first and last values, each panel has its own zero-based axis with clear space between them, the sidebar reads as context, and the event ticks and their counts don't collide with year labels.