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

Event Types bar chart, dark theme: Cyan, amber and magenta daily stacks over a thin alert-level strip.

Event Types

DarkBar

Cyan, amber and magenta daily stacks over a thin alert-level strip.

  • Charcoal#1A1A1D
  • VT cyan#4CC2E0
  • LP amber#F0B340
  • Tremor magenta#D9559A
  • Watch orange#F2762E

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 "Event Types" 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 volcano observatory daily bulletin panel on a dark charcoal screen. Crisp and scientific: three clearly separated event types stacked per day, and a thin status strip under the axis so escalation reads at a glance.

Colors (use these exact values):
- Background: #1A1A1D (dark charcoal).
- Series, bottom to top: #4CC2E0 (cyan), #F0B340 (amber), #D9559A (magenta).
- Status strip levels: #E8D44D (advisory yellow), #F2762E (watch orange), #E04545 (warning red).
- Primary text #EDEDF0; secondary text #9A9AA3; gridlines #2C2C31; baseline #55555C; source #6E6E77.

Typography (Google Fonts):
- Kanit throughout. Title 500 23px #EDEDF0 stating the finding; subtitle 300 15px #9A9AA3; legend 400 14px; y tick labels 300 13px; small uppercase labels ("EVENTS / DAY", "ALERT LEVEL STRIP") 500 11px with 1.2px letter-spacing; x labels 300 13px; peak value label 600 13px; source 300 12px.

Layout:
- 56px side margins; title near y 64, subtitle near y 92, a one-row legend near y 126 with 12px swatches (2px radius).
- Plot area from x 88 to 904, y 176 to 474, with the unit label above the y ticks.
- The status strip sits 8px under the baseline, 8px tall, one cell per day with 1px gaps. Day labels below it every 5 days, the first with the month ("1 Sep").
- A strip legend row at the bottom left and the source at the bottom right on the same baseline.

Axes and grid:
- Horizontal 1px #2C2C31 gridlines every 20 units, labeled at the left; no y axis line; a 1px #55555C baseline. No vertical gridlines.

Marks:
- Bar chart: stacked vertical bars at 70% of each day's slot, 1.5px background-colored gaps between segments, only the top segment of each stack with 2.5px rounded top corners. Label only the peak stack's total above it.
- Line chart: one 2px line per series in the same three colors with straight segments, small 3px dots at each point, direct end labels in 13px Kanit, and the same status strip under the x axis.

Avoid: pastel versions of the series colors, 3D, gradients, heavy gridlines, labels on every bar and a status strip that competes with the bars (keep it thin).

When you're done, render the chart and check that the stack order matches the legend, the strip has one cell aligned under each bar, the peak label is the true maximum, and the title claim holds for every day it covers.