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

Shot Mix bar chart, dark theme: Deep court-green 100% stacked bars with percentages printed on every segment.

Shot Mix

DarkBar

Deep court-green 100% stacked bars with percentages printed on every segment.

  • Court green#0E2A1F
  • Forehand lime#C5E86C
  • Backhand blue#9ED0F0
  • Volley white#FFFFFF
  • Serve gold#D8B45A

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 "Shot Mix" 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 performance-analytics page from a tennis broadcast's stats desk. Deep court green, condensed poster headings, bright tidy segments with the numbers printed right on them.

Colors (use these exact values):
- Background: #0E2A1F (deep court green). Empty bar track: #133528. Section divider: #2B5442.
- Categories, in order: #C5E86C (lime, forehand), #9ED0F0 (pale blue, backhand), #FFFFFF (white, volley), #D8B45A (muted gold, serve).
- Text: #EAF2EC primary, #8FB3A1 secondary. Labels inside segments: #0E2A1F. Eyebrow: #C5E86C.

Typography (Google Fonts):
- Anton for the title (34px, 0.6px letter-spacing, uppercase, stating the finding) and group headers (22px, 1.2px letter-spacing).
- Karla for everything else: eyebrow 700 12px uppercase 2.2px letter-spacing; subtitle 400 15px; legend 600 14px; row labels ("SET 1") 700 13px uppercase 1.2px letter-spacing; segment percentages 700 13px; row totals 700 14px; axis ticks and footnotes 12px.

Layout:
- 64px margins. Eyebrow, title, subtitle, then a legend row of 14px rounded (2px) swatches.
- Groups stacked vertically (one per player here): an Anton header on the left and a small "75 TOTAL" caption over the totals column, then one bar per row. A 1px #2B5442 divider separates groups.
- Bars run from x 176 to 812; row labels right-aligned 14px left of the bars; row totals 14px right of the bars. Percent axis (0, 25, 50, 75, 100%) under the last group; source and a rounding footnote at the bottom.

Axes and grid:
- No gridlines and no axis lines; the bars are the grid. Percent ticks only under the last group.

Marks:
- Bar chart: 100% stacked horizontal bars 24px tall on a 32px pitch, square corners, with a 2px background-colored gap between segments. Print each segment's rounded percentage centered inside in dark green; drop labels on segments narrower than 30px.
- Line chart: one 2.5px line per category in the same four colors with 4px dots, plotted as share of total per period; label each line at its right end in Karla 700 and keep the Anton group headers for small multiples.

Avoid: rounded bar ends, gradients, borders around segments, a legend without the in-bar labels, and colored text on colored fills.

When you're done, render the chart and check that every row sums to 100%, every printed percentage fits its segment, the four colors stay in the same order in every row, and the title's counts match the data.