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

Sea Level Trend line chart, light theme: Seaglass bulletin with a noisy gauge record, teal annual mean and a red trend.

Sea Level Trend

LightLine

Seaglass bulletin with a noisy gauge record, teal annual mean and a red trend.

  • Seaglass#EEF4F3
  • Deep teal#135A64
  • Trend red#C8392B
  • Gauge gray#9AABAA

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 "Sea Level Trend" 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 coastal agency's long-term monitoring bulletin. Calm seaglass paper, a noisy raw record in the background, a confident smoothed line on top and one red trend that carries the headline rate.

Colors (use these exact values):
- Page: #EEF4F3 (pale seaglass) for the whole canvas.
- Main series: #135A64 (deep teal). Trend or fitted line and its rate chip: #C8392B (red). Raw, high-frequency record: #9AABAA (gray-green).
- Primary text: #1B3136. Secondary text and tick labels: #5A6E71. Gridlines and rules: #D3E0DE; the zero or datum gridline is slightly stronger, #9FB6B4.

Typography (Google Fonts):
- Lustria 400 for the title only: 29px #1B3136, sentence case, stating the finding with its number.
- Istok Web for everything else: subtitle 15px #5A6E71 (measure, unit, place and period); legend 13px (the raw series 400 in #5A6E71, emphasized series 700 in their own color); tick labels 12px #5A6E71; point labels 13px 700 in the series color; the datum note 12px italic; source and method footers 12px.

Layout:
- 56px left margin. Title baseline at y 62, subtitle at y 92, a one-line legend at y 124 (24px line swatches drawn at each series' stroke weight, label 8px to the right, about 30px between items).
- Plot from x 104 to 900, y 150 to 478.
- Under the x-axis labels: a 1px #D3E0DE rule, then an italic note defining the reference datum (what zero means and what the measure includes). Footer at y 576: "Source: ..." left, the trend method and rate right-aligned.

Axes and grid:
- Horizontal gridlines only, 1px #D3E0DE, at round values; signed y labels (+50, 0, -50) right-aligned 12px left of the plot. No y-axis line.
- X-axis: 6px tick marks in #5A6E71 below the plot with decade labels; no baseline rule.

Marks:
- Line chart: the raw monthly record as a 0.8px #9AABAA line behind everything; the annual (or smoothed) series as a 2.8px #135A64 line with round joins; the fitted linear trend as a straight 2px #C8392B line across the full period. The latest point gets a 4.5px-radius teal dot with a 2px page-colored ring and a 13px 700 teal label with a 4px page-colored halo.
- Bar chart: annual values as slim #135A64 bars (about 60% of the band) from a zero baseline, positive up and negative down, square corners; a straight #C8392B trend line drawn across the bars; raw sub-period values, if any, as small #9AABAA ticks.
- Rate chip: a fully rounded #C8392B pill (32px tall, 16px radius) with the rate in 14px 700 white ("+2.2 mm per year"), placed in empty space below the trend and joined to it by a 1px red leader.

Avoid: area fills, gradients, shadows, markers on every point, a boxed legend, and any second y-axis. Compute the rate from the data (least squares), and make the title's total change equal rate times years.

When you're done, render the chart and check that the raw series stays visually quieter than the main line, the chip never covers the trend line, the datum note explains zero, and the title number matches the computed trend.