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

Elo History line chart, dark theme: Walnut profile page with a pale gold rating line, win dots and norm rings.

Elo History

DarkLine

Walnut profile page with a pale gold rating line, win dots and norm rings.

  • Walnut#1E1712
  • Pale gold#E2C275
  • Cream#F1E6D0
  • Rival gray#7A6F63

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 "Elo History" 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 player profile page in a premium dark theme: dark walnut wood, cream type, one pale gold line. Quietly celebratory, like a career retrospective.

Colors (use these exact values):
- Page: #1E1712 (walnut), with faint horizontal wood grain lines in #2A2019 (26 gently wavy lines, 0.8 to 2.2px, 70% opacity) and a radial vignette to 35% black at the corners.
- Hero series and highlights: #E2C275 (pale gold). Comparison series: #7A6F63 (faint gray brown).
- Primary text and title-event rings: #F1E6D0 (cream). Secondary text: #A8977D. Gridlines: #3A2E25.

Typography (Google Fonts):
- Cormorant Garamond with lining figures: title 600 40px #F1E6D0 (sentence case, stating the finding); peak label italic 600 18px gold; milestone captions italic 400 16px cream.
- Figtree for everything else: eyebrow 11px 600 uppercase with 2.6px letter-spacing in gold; subtitle 14px #A8977D with measure, period and a computed change; axis labels 12px #A8977D; legend 12px; event labels 11px 600 cream; end labels 13px (700 gold for the hero, 400 gray for the comparison); source 11px.

Layout:
- 56px margins. Eyebrow at y 50, title at y 96, subtitle at y 124, legend at y 156, plot from y 186 to 506, x from 80 to 812, with end labels to the right of the plot.

Axes and grid:
- Horizontal gridlines 0.8px #3A2E25 with right-aligned y labels; a 0.8px #A8977D baseline; year labels 24px below it. No vertical gridlines.
- Peak marker: a 0.7px gold dotted hairline (1 on 3) across the plot at the peak value, a small cream dot at the peak and an italic serif label centered above it with value and date. Compute the peak from the data.

Marks:
- Line chart: the hero series as a 2.6px gold line with straight segments and round joins; the comparison as a 1.5px #7A6F63 line underneath. Notable wins as gold dots r 4.5 with a 1.5px walnut ring on the line; title events as 7px cream rings (1.4px stroke, no fill) with 11px labels to the lower right.
- Bar chart: slim bars (45% of the band) in gold with 2px top corner radius, the comparison as #7A6F63 bars behind or beside at 60% width; value labels in 12px Figtree cream above; peak hairline and label as above.

Legend: one row: gold dot "win", cream ring "title event", short gray line for the comparison series.

Avoid: bright colors, glows, gradients on marks, heavy grids and area fills.

When you're done, render the chart and check that the peak label and hairline match the true maximum, the ring labels don't overlap each other or the line, and the grain stays subtle behind the data.