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

Annual Report bar chart, light theme: Ivory and navy, a big serif hero number, one gold bar and a CAGR bracket.

Annual Report

LightBar

Ivory and navy, a big serif hero number, one gold bar and a CAGR bracket.

  • Ivory#FAF7F0
  • Navy#14213D
  • Gold#B08D57
  • Muted#6E6A62
  • Rule#D9D3C7

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 "Annual Report" 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: the financial highlights spread of a premium corporate annual report. Confident, calm and expensive: lots of air, hairline rules, one big number and one precious accent color.

Colors (use these exact values):
- Page: #FAF7F0 (warm ivory) for the whole canvas.
- Primary ink and all ordinary data marks: #14213D (deep navy).
- Accent: #B08D57 (muted gold). Used only for the latest period's mark, its value label, the growth callout, the eyebrow and its short rule. Never for more than one data mark.
- Secondary text: #6E6A62. Hairline rules and faint gridlines: #D9D3C7.

Typography (Google Fonts), with lining figures everywhere (font-variant-numeric: lining-nums; the serif defaults to oldstyle figures, which clash here):
- Cormorant Garamond for the title (600, 40px, navy, sentence case, stating the finding), the hero numeral (500, 100px, -2px letter-spacing, with the unit as a 38px suffix), the growth callout numeral (500, 64px, gold) and data value labels (600, 19px navy; 24px gold for the latest period).
- Manrope for everything else: eyebrow 12px 600 uppercase with 3px letter-spacing in gold, preceded by a 36 x 2 px gold rule; subtitle 16px #6E6A62 stating measure, unit and period; small uppercase labels 12px 600 with 2.4px letter-spacing; category labels 14px 500 with 1px letter-spacing (the latest one 700 in navy); body notes 14px; source 12px; folio 11px 600 uppercase with 2px letter-spacing.

Layout:
- 56px side margins. Eyebrow at the top, the title about 50px below it, subtitle under the title, then a full-width 1px #D9D3C7 rule.
- A left "hero" column about 230px wide: a small uppercase label naming the headline metric and period, the hero numeral for the latest value, a small gold up (or down) triangle with the period-over-period change in 15px 600 navy, a 1px rule, then the growth callout numeral with a two-line explanation ("Compound annual growth rate, 2018 to 2025").
- A 1px vertical #D9D3C7 rule separates the hero column from the chart, which fills the rest of the width.
- A footer rule near the bottom with "Source: ..." on the left and a folio ("ANNUAL REPORT 2025 | 14") on the right.

Axes and grid:
- No y-axis line and no y-axis labels: every mark carries its own value label.
- At most three faint gridlines, 0.8px #D9D3C7 dotted (1 on, 4 off).
- A 1.2px navy baseline. Category labels centered 26px below it.

Marks:
- Bar chart: slender square-cornered bars (about 50% of the band, 34px at 8 bars), solid navy, the latest period solid gold. Value labels centered 10px above each bar.
- Line chart: a 2.5px navy line with straight segments, small navy dots (r 3.5) with an ivory 2px ring at each point, the latest point larger (r 6) in gold with its value label in 24px gold serif. An optional very light navy area fill (6% opacity) under the line.
- Growth callout on the chart: a 1px gold bracket from above the first mark to above the latest mark, with a 2.5px gold dot at each end, broken in the middle for the label "9.4% CAGR" in Manrope 13px 700, 2px letter-spacing. Compute the CAGR from the data: (last / first)^(1 / years) - 1.

Avoid: gradients, shadows, rounded corners, 3D, multiple accent colors, heavy borders, dense gridlines, and a legend (label things directly).

When you're done, render the chart and check that the numerals are lining (no descending digits), the CAGR and period change are arithmetically right, only one mark is gold, and there is generous whitespace around the hero number.