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

Capacity Auction bar chart, dark theme: Floating bid ranges on graphite, mint where cleared, split by a coral price rule.

Capacity Auction

DarkBar

Floating bid ranges on graphite, mint where cleared, split by a coral price rule.

  • Graphite#111315
  • Cleared mint#6EE7C2
  • Bid teal#3A8C85
  • Clearing coral#FF7F6B
  • Label gray#9AA3AD

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 "Capacity Auction" 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 market operator's auction results panel. Dark graphite, quiet and quantitative: mint shows what cleared, a teal outline shows what did not, and one coral rule marks the price that decided it.

Colors (use these exact values):
- Background: #111315. Gridlines: #23272C.
- Cleared portion of each range and cleared-row numbers: #6EE7C2 (mint).
- Uncleared portion of each range: outlined only, 1.2px #3A8C85 (muted teal), no fill.
- Clearing price rule and its tag: #FF7F6B (coral), tag text in #111315.
- Median ticks: #FFFFFF. Title and strong labels: #E6E9EC. Secondary labels: #9AA3AD. Axis numbers and faint notes: #5D656E.

Typography (Google Fonts):
- Sora for the title (27px 600, stating the finding), subtitle (14px #9AA3AD), category labels (13px, right-aligned; categories that fully cleared in #E6E9EC, others #9AA3AD), legend and notes (12px).
- IBM Plex Mono for every number: eyebrow (12px 500 uppercase, 1.8px letter-spacing), axis labels (12px #5D656E), the right-hand value column (14px, tabular) and its header (11px 500 uppercase, 1.2px letter-spacing), the price tag (12px 600).

Layout:
- Eyebrow at y 52, title at y 88, subtitle at y 114, a one-line legend at y 142 (mint swatch "Cleared", outlined swatch "Above clearing price", white tick "Median bid", coral line "Clearing price").
- Category labels end at x 218; plot from x 236 to 764; a right value column right-aligned at x 920 with a small header, a 1px #5D656E rule and a bold total under it.
- Rows 34px apart starting at y 196. Source at the bottom left, a one-line method note at the bottom right, both 12px.

Axes and grid:
- Vertical gridlines only, 1px #23272C, at round values, with mono labels 22px below the last row and the unit ("$/MW-day") right-aligned under them. No axis lines.

Marks:
- Bar chart: floating horizontal range bars 14px tall with square ends from each row's low to high value. The part below the threshold is solid mint; the part above is a 1.2px teal outline. A 2px white tick, 20px tall, marks the median. The threshold is a 2px coral vertical rule spanning all rows, topped by an 88 x 22 coral tag with 2px radius reading "$142 clear".
- Line chart: draw each series as a mint 2px line while it is below the threshold and a 1.2px teal line above it, the threshold as the same horizontal coral rule with its tag at the right edge, and white 2px ticks at median or key points.

Avoid: gradients, glows, rounded bars, filled bars above the threshold, more than one coral element, and proportional (non-mono) numbers.

When you're done, render the chart and check that fill switches to outline exactly at the coral rule, the count in the title matches rows that fully cleared, the value column sums to the total, and the price tag does not touch the legend.