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

Sideways Caption line chart, dark theme: Pink and cyan lines screen-blending on deep purple, with tiny spaced caps.

Sideways Caption

DarkLine

Pink and cyan lines screen-blending on deep purple, with tiny spaced caps.

  • Deep purple#1E0F2E
  • Electric pink#FF3EA5
  • Cyan#2DE2F0
  • Lilac caption#B9A6D1

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 "Sideways Caption" 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 1990s music magazine chart page on deep purple. Two electric lines cross and glow where they overlap, labels are tiny widely spaced capitals, and the captions and axis are pushed to the edges.

Colors (use these exact values):
- Page: #1E0F2E (deep purple).
- Series: #FF3EA5 (electric pink) and #2DE2F0 (cyan), both at 90% stroke opacity with mix-blend-mode screen so they turn near white where they cross.
- Captions, axis rules and ticks: #B9A6D1 (lilac). Gridlines: #3B2A55. Title and axis numbers: #F4ECFF.

Typography (Google Fonts):
- Rubik Mono One for the title, 30px, uppercase, in two lines 40px apart, stating the finding.
- Space Mono for all labels, as tiny widely spaced capitals: subtitle 11px with 2.5px letter-spacing; legend 11px 700 with 3px letter-spacing in the series color; year labels 10px with 3px letter-spacing; side caption 10px with 4px letter-spacing; axis numbers 11px; annotations 10px 700 with 3px letter-spacing; source 9px with 2.5px letter-spacing.

Layout:
- A caption rotated -90 degrees runs up the left edge at x 34 (publication, measure, period), next to a 1px #3B2A55 vertical rule at x 50.
- Title from x 76 at y 72 and 112, subtitle at y 146, legend (28px line swatches, 3px thick) at y 176.
- Plot x 76 to 832, y 212 to 516.
- The value axis sits on the right in a narrow ruled column x 852 to 912: 1px lilac rules on both sides and across the top, a tiny "PAGES" (unit) header, 8px tick marks from the left rule and centered numbers.

Axes and grid:
- Horizontal gridlines 1px #3B2A55; a 1px lilac baseline with 8px ticks at each year and the year label 4px right of its tick.
- No left axis.

Marks:
- Line chart: 3px lines with straight segments and round joins, pink drawn over cyan, both screen-blended. Mark the key crossing with a 1px #F4ECFF dotted vertical (2 on, 4 off) and a spaced-caps label. End values as 12px 700 labels in each series color.
- Bar chart: grouped square-cornered bars in pink and cyan at 90% opacity with the same screen blend, overlapping by 20% so the overlap glows; values in tiny spaced caps above the bars and the value axis in the same right-hand ruled column.

Avoid: large or bold labels other than the title, a left axis, gradients, drop shadows, and opaque lines that hide the crossing glow.

When you're done, render the chart and check that the crossings visibly brighten, the rotated caption fits on the canvas, every spaced-caps label stays clear of the lines, and the right-hand axis numbers align with the gridlines.