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

Grant Cycle line chart, dark theme: Dark teal cycle chart with a phase calendar strip and dotted phase boundaries.

Grant Cycle

DarkLine

Dark teal cycle chart with a phase calendar strip and dotted phase boundaries.

  • Dark teal#0E2A2B
  • Pale aqua#99F6E4
  • Awards white#FFFFFF
  • Open call teal#2DD4BF
  • Muted sea#8FB3AF

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 "Grant Cycle" 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 program officer's cycle review. Calm, nocturnal and orderly: dark teal, a calendar strip naming each phase, dotted phase boundaries and one glowing pale aqua curve.

Colors (use these exact values):
- Page: #0E2A2B (dark teal).
- Primary series: #99F6E4 (pale aqua) with a vertical gradient fill from 28% to 0% opacity. Secondary series: #FFFFFF (white).
- Phase strip fills: #2DD4BF at 20% opacity, #5EA8A0 at 20% and #E2E8E6 at 16%, each with a 3px solid left edge in its full color.
- Text #E6F4F1; secondary text and dotted boundaries #8FB3AF; gridlines #1D4244.

Typography (Google Fonts):
- Marcellus: title 32px #E6F4F1 stating the finding; phase annotations such as "Deadline" in 15px.
- Mulish for everything else: eyebrow 700 11px uppercase with 2.2px letter-spacing in #99F6E4; subtitle 15px #8FB3AF with measure, unit and totals; phase names 800 11px uppercase with 1.8px letter-spacing; phase ranges 600 10px #8FB3AF; axis labels 12px; direct labels 700 13px in the series color.

Layout:
- 64px side margins. Eyebrow at y 50, title at 92, subtitle at 122.
- Calendar strip at y 150, 30px tall, spanning the plot width and split into phase segments (radius 3, 2px gaps), each with its name left and its period range right, and small 4px ticks under it for each time step.
- Plot from x 104 to 896 and y 214 to 500.
- Footer: "Source: ..." left and a letter-spaced summary stat right, both 11px.

Axes and grid:
- Horizontal 1px #1D4244 gridlines, the zero line in #8FB3AF. No vertical grid. Week labels every five steps.
- Phase boundaries as 1.2px #8FB3AF dotted vertical lines (1.5 on, 4 off, round caps) running from the strip down to the baseline.

Marks:
- Line chart: the primary series a 3px smooth monotone line (no overshoot) in #99F6E4 with its gradient area; a 5px dot with a 2px page-colored ring at the peak and a direct label. The secondary series a thin 1.6px #FFFFFF line with straight segments and 2.6px white dots, drawn only over the phase where it occurs, labeled directly.
- Bar chart: slender columns (about 60% of the step) in #99F6E4 with 2px rounded tops, the secondary measure as narrower #FFFFFF columns, the same phase strip and dotted boundaries.

Avoid: neon glows, multiple accent colors, a boxed legend, heavy gridlines and hiding the phase context.

When you're done, render the chart and check that phase boundaries line up with the strip segments, the smoothed line never dips below zero, the direct labels clear the lines, and the title's percentage matches the data.