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

Aid Deliveries bar chart, dark theme: Logistics board of stacked tonnage by transport mode with a red blocked-road band.

Aid Deliveries

DarkBar

Logistics board of stacked tonnage by transport mode with a red blocked-road band.

  • Charcoal#1C1C1E
  • Road amber#F59E0B
  • Barge teal#0D9488
  • Air sky#38BDF8
  • Blocked red#4A1518

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 "Aid Deliveries" 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 logistics cluster operations board on a charcoal screen. Functional and confident: each transport mode has a pictogram and a strong hue, and disruption periods are shaded so the story of how the pipeline adapted reads at a glance.

Colors (use these exact values):
- Background: #1C1C1E.
- Series in stack order from the baseline: #F59E0B (road amber), #0D9488 (river barge teal), #38BDF8 (air sky blue).
- Disruption band: #4A1518 (dark red) behind the affected periods, with its label and affected period labels in #F87171.
- Title #F4F4F5, secondary text #9A9AA3, total labels #D4D4D8, gridlines #2E2E32 (dotted 2 3), baseline #52525B.
- Legend chips: #27272A fill with a 1px #3F3F46 stroke.

Typography (Google Fonts):
- Rubik throughout. Eyebrow 500 12px uppercase with 1.6px letter-spacing muted, preceded by an 8px amber square. Title 600 27px, stating the finding with the number. Subtitle 400 15px muted.
- Legend labels 500 13px; axis labels 12px muted; axis caption "TONNES" 500 10.5px with 1.2px letter-spacing; total labels 500 11.5px; band label 600 11.5px uppercase with 1.6px letter-spacing; source 12px muted.

Layout:
- 40px side margins. Eyebrow at y 42, title at y 82, subtitle at y 108.
- Legend row at y 146: one 26px-tall pill chip (radius 13) per mode containing a 20px solid pictogram (truck, barge, plane) in the mode color and the mode name, followed by a 16px #4A1518 square with "Main road blocked" in #F87171.
- Plot from x 88 to 920, y 196 to 510. Footer rule at y 546 and the source at y 570.

Axes and grid:
- Left axis labels at round values, dotted 1px #2E2E32 gridlines, solid #52525B baseline. Period labels 20px below; disrupted periods' labels in #F87171.
- The disruption band spans the affected slots edge to edge, from 30px above the plot top to the baseline, with its uppercase label centered 12px above the top gridline.

Marks:
- Bar chart: stacked columns 64% of the slot width, square corners, 1.5px gaps between segments (take them from each segment's height). The column total sits 8px above each stack.
- Line chart: one 2.5px line per mode in the same colors with small 3px dots, or a stacked area with the same stack order and 1.5px background-colored separators; keep the disruption band and legend chips identical.

Avoid: rounded bar tops, gradients, glows, a fourth series color, legends inside the plot, and red used for anything other than the disruption.

When you're done, render the chart and check that the stack order matches the legend, the tonnage in the title matches the sum over the shaded periods, the band covers exactly the affected columns, and total labels clear the band label.