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

Spectral Classes bar chart, dark theme: Star-colored bars from blue O to red M with large class letters on navy.

Spectral Classes

DarkBar

Star-colored bars from blue O to red M with large class letters on navy.

  • Survey navy#0A1024
  • O blue#3F63FF
  • A blue-white#BFCFFF
  • G yellow#FFCF45
  • K orange#FF8430
  • M red#D8301F

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 "Spectral Classes" 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 survey census plate from a planetarium exhibit. Deep navy sky, each bar glowing in the color of the stars it counts, big confident category letters and a blackbody color strip running along the foot.

Colors (use these exact values):
- Background: #0A1024, with a sparse field of tiny stars (r 0.6, a few r 1.2) in #C8D2F0 at 20 to 55% opacity in the header area only, kept clear of the text.
- Category colors along an ordered scale, hot to cool: #3F63FF, #82A0FF, #BFCFFF, #FFF8E6, #FFCF45, #FF8430, #D8301F. For fewer categories take evenly spaced steps from this ramp; keep adjacent steps visibly different.
- Primary text #E4E9F7; secondary text #8E9AC0; gridlines #1E2A4A; baseline #44507A.

Typography (Google Fonts):
- Bai Jamjuree throughout. Eyebrow 600 12px uppercase with 2.4px letter-spacing in #8E9AC0; title 600 31px #E4E9F7 stating the finding; subtitle 15px #8E9AC0.
- Category letters 700 40px in each bar's own color, centered 46px below the baseline; the range underneath in 12.5px #8E9AC0.
- Value labels 600 15px #E4E9F7 10px above each bar; axis ticks 13px; small caps notes 600 10.5px with 1.6px letter-spacing.

Layout:
- 56px side margins. Eyebrow at y 52, title at y 92, subtitle at y 120.
- Plot from x 110 to 904 with the baseline at y 436 and the top gridline at y 196. The category letter row, then the range row, then a 4px rounded blackbody strip (a left-to-right gradient through all the category colors) 82px below the baseline with caps end labels ("HOTTER, BLUER", "COOLER, REDDER").
- Source at the bottom left and a computed fact at the bottom right, both 12px #8E9AC0.

Axes and grid:
- Linear y scale from zero, 3 horizontal 1px #1E2A4A gridlines with compact labels (20k, 40k, 60k), and the axis title in small caps above the tick column stating the scale ("STARS, LINEAR SCALE"). Never a log scale for bars.
- A 1px #44507A baseline. No vertical grid.

Marks:
- Bar chart: square-cornered bars 62px wide (about 55% of the band), filled with a vertical gradient of the category color from 100% at the top to 55% at the base, a 2px solid cap of the same color on top, and a soft glow behind the top 60px (the color at 35% opacity with a Gaussian blur of 9). Very small values get a 2px minimum stub and still carry a value label; add a short note explaining a nearly invisible bar.
- Line chart: a 2.5px line whose stroke is the same left-to-right blackbody gradient, with r 6 dots filled in each point's category color and a soft 9px glow behind each dot, value labels above in 600 15px and the big category letters under the axis.

Avoid: log-scaled bars, rainbow hues outside the blackbody ramp, gridlines brighter than #1E2A4A, a legend (the letters are the legend), and stars behind any text.

When you're done, render the chart and check that adjacent category colors are distinguishable, the tiniest bar is still visible with its label, the letters line up under their bars, and the title percentage matches the data.