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

Esports bar chart, dark theme: A VS broadcast lockup, slanted tug-of-war bars and red versus cyan teams.

Esports

DarkBar

A VS broadcast lockup, slanted tug-of-war bars and red versus cyan teams.

  • Charcoal#14161B
  • Panel#1D2027
  • Red team#FF2E4D
  • Cyan team#00E5FF
  • Text#F2F4F8
  • Muted#8A92A3

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 "Esports" 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 post-match graphic from a competitive gaming broadcast. Aggressive, angular and fast: slanted shapes, cut corners, two team colors fighting across a charcoal stage.

Colors (use these exact values):
- Stage: #14161B, lit by a radial gradient from #2A2E38 at the top center. Panels: #1D2027.
- Team A: #FF2E4D (bar gradient from #B8132F on the left to #FF2E4D). Team B: #00E5FF (bar gradient from #00E5FF to #00A9C9).
- Text: #F2F4F8. Muted labels: #8A92A3. Stat names: #B7BDC9. Source line: #5F6675.

Typography (Google Fonts):
- Headline type: Barlow Condensed italic. Title 38px 800 uppercase, centered. Team tags 44px 900. "VS" 50px 900. Big values 28px 800.
- Labels: Rajdhani. Eyebrow 14px 700, letter-spacing 3.5px, uppercase (like "GRAND FINAL // MAP 3 // POST-MATCH"). Subtitle 14px 600, letter-spacing 1.5px, uppercase. Stat names 14px 700, letter-spacing 2.5px. Percentages inside bars 15px 700. Source 12px 600, letter-spacing 2px.

Layout:
- Top: centered eyebrow, then a VS lockup. Left and right team panels (300 x 70px, two opposite corners cut at 45 degrees by 16px, #1D2027 overlaid with a horizontal gradient of the team color from 34% to 6%, a 4px team-color stripe along the bottom and a small solid team-color triangle in the cut corner). Each panel holds the 3-letter team tag, the team name in its color and a muted side label, plus a slanted score box next to the VS. The winning score box is filled with its team color; the losing one is outlined.
- Title stating the finding centered below, subtitle with the measure and the key facts under it.
- Corner slashes: a solid and a 50% team-color parallelogram in the top-left (team A) and bottom-right (team B) corners.
- Texture: diagonal stripes over the whole stage (5px white stripes at 2.5% opacity on a 14px pitch, rotated -35 degrees).

Axes and grid:
- No gridlines or axes. For comparisons, a dashed 50% marker (#F2F4F8, 1.5px, 3/3 dashes at 70% opacity) runs through each bar only, never through labels, with a small triangle and "50%" label under the last row.

Marks:
- Bar chart: slanted parallelogram bars (24px tall, top edge shifted 9px right). For two-team comparisons, each row is one tug-of-war bar split at the team A share, with a 6px gap at the split: team A on the left, team B on the right, share percentages inside each end, raw values outside each end in 28px italic (the higher value in its team color, the lower in white). A dark #0C0D10 slanted track at 70% sits 3px behind each bar. For single-series bars use team B cyan with the top bar in team A red. Both bar colors get a 2px diagonal hatch (white 16% on red, black 14% on cyan) and an 8px team-color outer glow at 40 to 45% opacity.
- Line chart: 3px lines with sharp miter joins, team A red and team B cyan with the same glow, square 8px markers rotated 45 degrees, and the final values in slanted end tags filled with the team color.

Avoid: rounded corners, circles, serif or rounded fonts, pastel or muted team colors, drop shadows under text, and glows that clip at the canvas edge.

When you're done, render the chart and check that the 50% marker never crosses a label, every percentage fits inside its bar segment, and the angles of bars, panels and slashes all lean the same way.