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

Bullet Graph bar chart, dark theme: Stacked KPI bullet graphs with graded gray bands, a white bar and amber targets.

Bullet Graph

DarkBar

Stacked KPI bullet graphs with graded gray bands, a white bar and amber targets.

  • Charcoal#1A1C20
  • Good band#2B2E33
  • Poor band#4C5157
  • Actual#F5F5F5
  • Target amber#FFB000
  • Miss red#FF6B6B

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 "Bullet Graph" 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: an operations dashboard printed for a board pack. Dense, monochrome and honest: gray ranges give context, one white bar shows performance, amber marks the goal, and red flags only what missed.

Colors (use these exact values):
- Background: #1A1C20 (charcoal).
- Qualitative ranges, from poor to good: #4C5157, #3A3E44, #2B2E33 (the poor range is the lightest so it stands out).
- Performance bar: #F5F5F5. Target tick: #FFB000 (amber).
- Below-target values and deltas: #FF6B6B. Above-target deltas: #8FD694.
- Secondary text #9BA1A9, scale tick labels #7D838B, ticks #6A7078, row dividers #26292E, header rule #34383E.

Typography (Google Fonts):
- IBM Plex Sans Condensed for words: title 600 30px #F5F5F5 stating the finding; subtitle 16px #9BA1A9; measure names 600 17px; units 13px #9BA1A9; legend 13px; footer 12.5px.
- IBM Plex Mono for numbers: actual value 600 20px; delta 500 13px; "of <target>" 11px; scale labels 9.5px; column headers 500 10.5px uppercase with 1.2px letter-spacing.

Layout:
- 56px side margins. Title baseline y 58, subtitle y 86.
- A legend row at y 118 (three range swatches "Poor / fair / good", a white bar "Actual", an amber tick "Target") with the value-column headers "ACTUAL" and "VS TARGET" on the right, then a 1px rule.
- Stacked rows 66px tall: measure name and unit at x 56, the bullet from x 292 to x 736, the actual value at x 760, the delta and "of <target>" right-aligned at x 904. 1px dividers between rows.

Axes and grid:
- Each row has its own scale from zero with 4px ticks and small mono labels under the band (first label left-aligned, last right-aligned). No shared axis and no gridlines.

Marks:
- Bar chart (bullet): three range bands 26px tall with square corners; the performance bar only 8px tall, centered; the target tick 3px wide and 36px tall so it rises above and below the bands.
- Line chart: draw each measure as a small-multiple row with the same gray range bands as horizontal bands behind a 2px #F5F5F5 line, the target as a 1.5px amber horizontal line, and the last point as a 4px white dot; keep the same value column.
- Actual values turn #FF6B6B when below target; deltas are signed with a true minus sign.

Avoid: color in the range bands, rounded bars, gauges or dials, 3D, gradients and glows.

When you're done, render the chart and check each row uses its own scale, target ticks are visibly taller than the bands, exactly the below-target rows are red, and the count of misses in the title matches.