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

Delivery Windows line chart, light theme: Courier app ops view with mint time-window blocks and orange late-peak clocks.

Delivery Windows

LightLine

Courier app ops view with mint time-window blocks and orange late-peak clocks.

  • Mint#10B981
  • Deep mint#047857
  • Late orange#F97316
  • Ink#0F172A
  • Slate#64748B

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 "Delivery Windows" 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: the operations screen of a grocery courier app. Crisp white canvas under a solid mint app bar, one confident mint series, booked time windows as soft mint blocks behind the data and small orange clock icons that flag when deliveries ran late.

Colors (use these exact values):
- Canvas: #FFFFFF. App bar: #10B981, full width, 64px tall.
- Primary series: #10B981. Area under it: a vertical gradient of #10B981 from 16% opacity at the top to 0 at the baseline.
- Promised windows (time blocks): #10B981 at 9% opacity with a 3px #10B981 cap at 55% opacity along the top edge; their labels in #047857 at 80% opacity.
- Late or problem points: #F97316 for icons, rings and pill borders (pill border at 45% opacity), #FFF7ED pill fill, #C2410C pill text.
- Text: #0F172A for the title and legend, #64748B for the subtitle, axis labels and target label, #94A3B8 for the y labels and source line.
- Gridlines: #EEF2F6; baseline and ticks #CBD5E1. Target line: #64748B dashed.
- Additional series if needed: #0EA5E9 then #8B5CF6, 2.5px, never orange (orange is reserved for alerts).

Typography (Google Fonts): Plus Jakarta Sans everywhere, tabular figures (font-variant-numeric: tabular-nums) for all numbers.
- App name 18px 800 white with -0.3px tracking, followed by the section name ("Dispatch") 15px 500 white at 85% opacity.
- Title 26px 800, letter-spacing -0.5px, stating the finding. Subtitle 14px 500 with the measure and unit.
- Legend 12.5px 600. Axis labels 12px 500. Window labels 11px 700. Alert pills 12px 700. Source 11.5px 500.

Layout:
- App bar at the top: a 32px white rounded square (9px radius) with a mint outline cart icon at x 28, then the app name. At the right, a white route summary chip 34px tall and fully rounded with a soft shadow (0 2px 6px #0F172A at 12%): a mint map pin on a pale mint circle, a bold context label (such as "Tuesday routes"), a 1px #E2E8F0 divider, then the stop count and distance in #64748B separated by a small gray dot.
- Title at y 112 and subtitle at y 139, both left-aligned at x 40. Legend row at y 176: a 22px mint line swatch, a 22 x 16 mint block swatch, and a small orange clock, each with its label.
- Plot from x 76 to 892, y 218 to 506. Source line at the bottom left, y 568.

Axes and grid:
- Horizontal gridlines only, 1px #EEF2F6, with a #CBD5E1 baseline. Y labels right-aligned 12px left of the plot with a % suffix. Pick a y range that frames the data tightly (here 75% to 100%) rather than starting at zero.
- X ticks at every step, 6px long for labeled ones and 4px for unlabeled ones, #CBD5E1; label every second step (8 AM, 10 AM...).
- A dashed (5/4) 1.2px #64748B target line with a "Target 90%" label right-aligned at the end of the plot on a small white knockout.

Marks:
- Line chart: a 3.5px smooth monotone line with round caps and joins over the gradient area. Every point gets a 3px white dot with a 2px mint ring. Behind everything, draw the booked windows as blocks spanning their x range and the full plot height (8px radius, starting 12px above the plot), labeled bottom-left inside the block. For each late trough, replace the dot with a 5px #F97316 dot with a 2px white ring, drop a 1.5px orange stem 18px long, then a 12px-radius white clock icon (2.2px orange outline and hands pointing to 12 and about 4), then a fully rounded 100 x 22 pill below reading "6 PM · 83.9%".
- Bar chart: mint #10B981 bars with 6px top radius and 35% gaps over the same mint window blocks; bars below the target turn #F97316 and carry the clock icon above them with the value pill. Keep the dashed target line across the bars.

Avoid: dark backgrounds, heavy gridlines, more than one alert color, filled clock icons, gradients on the bar, and labeling every point.

When you're done, render the chart and check that the window blocks sit behind the line, each clock and pill clears the line and the window labels, the title's number matches the lowest point, and the route chip text fits inside the chip.