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

Outline Numerals line chart, dark theme: Forest green lines with the latest value set huge in outline behind them.

Outline Numerals

DarkLine

Forest green lines with the latest value set huge in outline behind them.

  • Forest#12301F
  • Tangerine#F28C38
  • Cream#F3E9D2
  • Sage#7FA88A

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 "Outline Numerals" 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 confident civic report cover. Deep forest green, a wide expressive display face, and the headline number set enormous in outline behind the chart like a watermark.

Colors (use these exact values):
- Background: #12301F (deep forest green).
- Lead series and the outline numeral: #F28C38 (tangerine).
- Second series and the title: #F3E9D2 (cream).
- Third series: #7FA88A (sage).
- Muted text and y ticks: #A9B8A6.

Typography (Google Fonts), with lining, tabular figures everywhere (font-variant-numeric: lining-nums tabular-nums; the display face otherwise uses figures that drop below the baseline):
- Syne for all text.
- Eyebrow 600, 11px, uppercase, 2.6px letter-spacing, tangerine.
- Title 700, 34px, -0.8px letter-spacing, cream, stating the finding.
- Subtitle 400, 15px, muted.
- Axis labels 400, 12px, muted. End values 700, 15px and series names 500, 14px, both in the series color. Start values 600, 12px.
- Outline numeral 800, 200px, -6px letter-spacing.

Layout:
- 48px margins. Eyebrow at y 70, title at y 114, subtitle at y 144.
- Plot from about x 96 to 752, y 196 to 488; the right 160px holds the direct labels.
- Footer at y 566: "Source: ..." left and a one-line secondary finding right, both 11px muted.

Axes and grid:
- No gridlines and no axis lines except a 1.5px cream baseline.
- X ticks hang below the baseline: 1px cream, 8px long for labeled years, 4px for the rest. Labels every few years, centered 26px below.
- Y axis is only short 8px muted tick marks (1px) with labels right-aligned beside them.

Marks:
- Line chart: straight segments with round joins; the lead series 3.5px tangerine, the others 2.5px cream and sage, drawn so the lead sits on top. End dots with a 2px background-colored ring (radius 5.5 for the lead, 4 for others). Small start values beside the first points.
- Bar chart: square-cornered bars on the cream baseline, the lead category in tangerine and the others in cream at 85% or sage; direct value labels above the bars in Syne 700.

Labels and annotation:
- Direct labels at the line ends: the value first (for example "34%") then the series name, in the series color, spaced so they never collide.
- The outline numeral is the lead series' latest value, drawn with no fill and a 2px tangerine stroke at 24% opacity, right-aligned to the end of the plot with its baseline 12px above the chart baseline, behind every mark.

Avoid: filled numerals, gridlines, legends, drop shadows, more than three series colors and figures that descend below the baseline.

When you're done, render the chart and check that the outline numeral matches the latest lead value, stays behind the lines without swallowing them, sits above the baseline, and that no end labels collide.