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

Employer Match bar chart, dark theme: Navy stacked bars in soft blue and gold with dashed cap lines and check marks.

Employer Match

DarkBar

Navy stacked bars in soft blue and gold with dashed cap lines and check marks.

  • Navy#101A33
  • Soft blue#7FA7E0
  • Gold#D9A93F
  • Cream#F2EBDD
  • Muted#8C97B3

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 "Employer Match" 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 year-end savings summary from a premium workplace plan. Deep navy, an elegant italic serif headline, gold for money that someone else gave you.

Colors (use these exact values):
- Background: #101A33 (navy).
- Own contributions (the base segment): #7FA7E0 (soft blue). Employer match (the top segment): #D9A93F (gold).
- Headline, cap lines and ordinary running totals: #F2EBDD (cream). Secondary text: #8C97B3. Gridlines and footer rule: #1F2B4D.

Typography (Google Fonts):
- Cormorant for the title (italic 600, 44px, cream, stating the finding) and the inline italic annotation (17px, gold).
- Epilogue for everything else: subtitle 15px #8C97B3; legend 13px 500 cream; running totals 12px 500 cream (latest 700 gold); axis labels 12 to 12.5px #8C97B3; footer 12px, with the headline total 600 gold.

Layout:
- 56px side margins. Title at y 78, subtitle at y 110, legend row at y 138 (14px swatches with 2px radius plus a dashed line sample for the cap) and a right-aligned note "Running total above bars".
- Plot from x 96 to 904, y 178 to 500. Footer rule at y 546, source left and the summed employer total right in gold.

Axes and grid:
- Four 1px #1F2B4D gridlines with  labels right-aligned left of the plot; a 1px #8C97B3 baseline; year labels 22px below.

Marks:
- Bar chart: 38px stacked bars, soft blue at the base and gold on top, separated by a 1.5px background-colored gap. A cream dashed cap line (1.2px, dash 4 3) across each bar, 7px wider on both sides, at the level the stack would reach at the maximum match. Bars that reach the cap carry a small navy check mark (a 2.4px stroked path, round caps) centered in the gold segment. The running cumulative total sits 10px above the higher of the bar top or cap line.
- Line chart: a soft blue line for own contributions and a gold line for the match (2.5px each), with a dashed cream line for the cap; points where the match equals the cap get a gold dot with a navy check mark; running totals as small labels above the upper line.

Labels and annotation: one short italic gold annotation in open space explaining the uncapped years ("Contributing under 5% left match unclaimed").

Avoid: gradients, glossy effects, rounded bar tops, bright white, and more than two fill colors.

When you're done, render the chart and check that the cumulative totals add up, check marks appear only where the match equals the cap, cap lines never hide behind labels, and the count in the title matches the checks.