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

Footfall Paths bar chart, dark theme: Gravel-textured bars on steel edging, one ochre path and a dotted capacity line.

Footfall Paths

DarkBar

Gravel-textured bars on steel edging, one ochre path and a dotted capacity line.

  • Charcoal green#141A16
  • Gravel#C9C2B0
  • Ochre#D69A3A
  • Steel edging#6E7466

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 "Footfall Paths" 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 garden estate's visitor survey presented at dusk. Bars read as gravel paths laid between steel edging, with one warm ochre path singled out and a dotted design capacity drawn across.

Colors (use these exact values):
- Page: #141A16 (dark charcoal green).
- Ordinary bars: #C9C2B0 (pale gravel) filled with a gravel pattern: a 36px tile with about 46 small ellipses (0.7 to 2.1px wide) in #B3AB97, #DDD7C8, #A69E8A and #E6E1D4.
- Highlight bar: #D69A3A (ochre) with the same pattern in #C08530, #E4AE55, #B07828 and #EDBB67.
- Steel edging: #6E7466. Grid: #26302A. Capacity line and label: #EDE6D2. Value and name labels: #D9D4C6. Secondary text: #8C958A. Title: #F1EEE6.

Typography (Google Fonts):
- Archivo Narrow throughout: title 700 34px, sentence case, stating the finding; eyebrow 600 13px uppercase with 2.8px letter-spacing in ochre; subtitle 16px #8C958A; axis labels 14px; value labels 700 16px (19px ochre for the highlight); category names 600 15px under each bar (700 ochre for the highlight) with a 13px secondary line beneath (for example the path width); capacity label 600 15px; source 13px.

Layout:
- 48px margins; eyebrow, title and subtitle at the top left. Plot from x 96 to 904, y 176 to 470. Category names 28px below the baseline and the secondary line 18px lower. Source at the bottom left.

Axes and grid:
- Horizontal 1px #26302A grid lines at round values with thousands separators on the left labels. No vertical grid.
- Baseline: a 0.8px #6E7466 line plus, under each bar, a 3px #6E7466 edging strip 8px wider than the bar on each side.
- Design capacity: a 1.6px #EDE6D2 dotted line (dash 0.1, gap 6, round caps) across the plot with its label right-aligned just below the line at the right end.

Marks:
- Bar chart: square-cornered vertical bars about 58px wide at 8 bars, gravel-patterned, each flanked by 1.2px #6E7466 edging lines 2px outside its sides. The single highlight bar is ochre; value labels 10px above each bar; the highlight also gets an ochre note of how far it exceeds the capacity.
- Line chart: a 3px #C9C2B0 line with straight segments and 7px square gravel-patterned markers outlined in #6E7466, the highlighted point as an ochre marker with its label, the same dotted capacity line and edging-strip baseline.

Avoid: rounded bars, gradients, glows, more than one ochre element per chart, and busy textures that make values hard to read.

When you're done, render the chart and check that the gravel texture is visible but fine, the highlight is the only warm element, the capacity label does not sit on a grid line and the title claim matches the data.