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

Speed Stripes bar chart, dark theme: Hot orange bars launched by red, magenta and violet speed trails on navy.

Speed Stripes

DarkBar

Hot orange bars launched by red, magenta and violet speed trails on navy.

  • Navy#0B1638
  • White-hot orange#FF9A36
  • Red#E8333A
  • Magenta#D02C8E
  • Violet#7A45D1

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 "Speed Stripes" 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 1970s high-speed rail poster. Deep navy night, white-hot orange bars with rounded noses launched from the axis by slanted speed-stripe trails, heavy italic type. Fast, bright, and exact.

Colors (use these exact values):
- Background: #0B1638 (deep navy).
- Bars: #FF9A36 (white-hot orange), with a 2px #FFE2B0 highlight line at 70% opacity just inside the top edge.
- Trail stripes, from the axis outward: #7A45D1 (violet), #D02C8E (magenta), #E8333A (red).
- Text: #FFF6EA for the title and values, #C9D0E6 for category labels, #8E9AC0 for subtitle, axis labels and notes. Gridlines: #1F2C58; axis line #8E9AC0.

Typography (Google Fonts), all Exo 2:
- Title: 900 italic 34px #FFF6EA, stating the finding with the key number.
- Subtitle: 400 16px #8E9AC0 (measure, unit, period). Category labels: 500 14px (the top item 700 #FFF6EA), right aligned 16px left of the axis. Values at bar ends: 600 italic 16px #FFF6EA; the top value 800 italic 18px in orange. Axis labels 500 13px; notes 400 italic 12px.

Layout:
- Signature horizon: three thin full-width stripes across the top of the canvas: red 4px at y 14, magenta 3px at y 22, violet 2px at y 29.
- Signature emblem: a 24px radius circle with a 3px orange ring and three short slanted bars inside (red, orange, violet, 5px tall), 78px from the left, beside the title. Title starts at x 118, baseline y 104; subtitle at y 134.
- Axis at x 256; plot to x 860. Rows 34px apart starting at y 186.

Axes and grid:
- A 1.5px vertical axis line at zero. Vertical 1.5px #1F2C58 gridlines at round values, labelled below the last row, with the unit on the last label only ("300 km/h").

Marks:
- Bar chart: horizontal bars 20px tall, sorted longest first, evenly spaced. Each bar is launched from the axis by a trail of three slanted parallelogram segments, each 20px long with 5px gaps and a 5px forward lean: violet 6px tall touching the axis, then magenta 11px, then red 16px, all centered on the bar. The orange bar starts 75px from the axis with the same slanted left edge and a fully rounded right end (radius 10). The whole length, trail included, encodes the value from zero. The value sits 10px past the bar end.
- Line chart: a 4px orange line with round joins; behind it three parallel trailing strokes offset below and behind it (red 3px, magenta 2px, violet 1.5px, each offset 6px further down and fading out toward the start of the line), a rounded orange end dot, and the last value in italic beside it.

Avoid: bars that start away from zero, square bar ends, gradients on the bars, glows, more than one bright data color, upright (non-italic) title type.

When you're done, render the chart and check that the trail plus bar length is proportional to the value from zero, bars are sorted, the italic values never touch the bar ends, and the horizon stripes run the full width.