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

Loss Curves line chart, light theme: A conference-paper figure with smoothed runs over raw traces on a log axis.

Loss Curves

LightLine

A conference-paper figure with smoothed runs over raw traces on a log axis.

  • Blue#0072B2
  • Vermilion#D55E00
  • Bluish green#009E73
  • Frame#262626
  • Paper#FFFFFF

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 "Loss Curves" 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 figure from a machine learning conference paper. Precise, quiet and honest about noise: a boxed plot with inward ticks, colorblind-safe series, raw values shown faintly behind their smoothed versions, and a numbered caption underneath.

Colors (use these exact values):
- Background: #FFFFFF everywhere. No panel fill.
- Series, in this order: #0072B2 (blue), #D55E00 (vermilion), #009E73 (bluish green). Assign the worst-performing series vermilion, the middle one blue and the best one green, or keep the order of my data if there is no ranking.
- Main text and axis labels: #1A1A1A. Secondary text: #5C5C5C. Axes frame and ticks: #262626. Legend border: #BDBDBD.

Typography (Google Fonts):
- Source Sans 3 for the title (700, 26px, -0.2px letter-spacing, stating the finding), the subtitle (400, 16px, #5C5C5C, measure, unit and scale), the caption (15px #1A1A1A, starting with a bold "Figure 3." run-in label) and the source line (12px #5C5C5C).
- STIX Two Text for everything mathematical: tick labels (16px), axis titles (17px) with variables set in italic (for example "training step t (×10³)" and "loss ℒ(t)" with t and ℒ italic), and annotations such as "η decay η → 0.1η" (16px, η italic; STIX Two Text has no arrow glyph, so draw the arrow as a thin stroked path in the ink color on the math axis).
- Source Code Pro for series names in the legend (500, 14px) and the final values beside them (400, 14px, #5C5C5C, right-aligned).

Layout:
- Title baseline at y 52 and subtitle at y 80, both left-aligned with the plot frame at x 96.
- Plot frame from x 96 to 896 and y 112 to 452. Rotated y-axis title centered 44px left of the frame; x-axis title 46px below it.
- Caption two lines at 20px leading starting 88px below the frame, left-aligned to the frame. Source line 18px above the bottom edge.

Axes and grid:
- A full box: a 1.1px #262626 rectangle around the plot area. No gridlines at all.
- Ticks point inward on all four sides, 1px #262626: major ticks 7px, minor ticks 4px. The top and right sides mirror the bottom and left ticks without labels.
- A log-scaled y-axis when the values span a factor of two or more, with labeled majors (3, 4, 5, 6 inside one decade) and unlabeled minors between them. Tick labels 10px left of the frame and 22px below it.

Marks:
- Line chart: draw every series twice. The raw per-step values as a 0.8px line in the series color at 28% opacity, and the smoothed values (exponential moving average) as a 2px solid line with round joins on top. Behind both, a seed-variance band (±1 s.d.) filled with the series color at 13% opacity. Clip all marks to the frame.
- Bar chart: grouped vertical bars in the series colors at 85% opacity with a 1px stroke of the same color, bars 70% of the group width with 2px gaps, square corners, sitting on the frame's bottom edge. Error bars in #1A1A1A, 1px, with 4px caps, for the seed s.d. Keep the box and inward ticks.
- Events such as a learning-rate decay or a data-mix change: a vertical #1A1A1A line at 1.1px with a dotted dash (1.5 on, 3.5 off, round caps) spanning the full frame height, labeled to its left near the bottom in STIX Two Text 16px with a 13px Source Sans 3 note in #5C5C5C below ("at step 80k").

Legend:
- Inside the plot at the top-right corner, 14px from the frame: a #FFFFFF box at 94% opacity with a 0.8px #BDBDBD border and 2px radius, about 206px wide. One row per series at 22px spacing: a 26px sample line in the series color (2px), the monospace series name, and the final smoothed value right-aligned. A last row shows a pale 0.8px sample labeled "raw, unsmoothed" in 13px #5C5C5C.
- Order legend rows to match the vertical order of the lines at the right edge.

Avoid: gridlines, filled backgrounds, drop shadows, rounded plot corners, outward ticks, a legend outside the plot, more than three bright hues, and em dashes in the caption.

When you're done, render the chart and check that the raw traces stay visibly paler than the smoothed lines, the ticks point inward on all four sides, the legend does not cover any data, and the caption starts with "Figure 3." and describes the smoothing and the bands.