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

Languages Studied bar chart, dark theme: Saturated pill bars with button lips and code badges, one hue per language.

Languages Studied

DarkBar

Saturated pill bars with button lips and code badges, one hue per language.

  • Near black#0D0D0D
  • Crimson#E11D48
  • Gold#CA8A04
  • Emerald#059669
  • Azure#0284C7
  • Violet#7C3AED

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 "Languages Studied" 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 bold, game-like leaderboard in a lesson app. Near-black board, chunky saturated pills with a pressed-button lip, one color per category.

Colors (use these exact values):
- Background #0D0D0D.
- Category colors in order, each with a darker lip and a light tint for outside labels: crimson #E11D48 (lip #9F1239, tint #FB7185); gold #CA8A04 (lip #854D0E, tint #FACC15); emerald #059669 (lip #065F46, tint #34D399); azure #0284C7 (lip #075985, tint #38BDF8); violet #7C3AED (lip #5B21B6, tint #A78BFA). A catch-all "others" row in #3F3F46 with lip #27272A and tint #A1A1AA.
- Title #FFFFFF, subtitle #A1A1AA, footer #71717A, a dashed #262626 rule above the catch-all row.

Typography (Google Fonts):
- Lilita One for the title (38px white, sentence case, stating the finding), the code badges (18px white) and the outside share labels (22px in the tint).
- Nunito for everything else: subtitle 600 16px; category names 800 19px white (#A1A1AA for the catch-all); in-bar values 900 18px white; footer 600 12px.

Layout:
- 48px side margins. Title at y 66, subtitle at 96. Rows start at y 134, 66px apart. Each row: a 44 x 40 rounded (radius 11) code badge at x 48 in the category color with a 3px lip below, the name at x 106, the bar from x 236 to at most x 820, the share label 16px past the bar end.
- Source bottom left and a short note about the share labels bottom right, both at y 580.

Axes and grid:
- No axes, gridlines or tick labels. Sort rows by value, largest first, with any catch-all row last after a dashed rule.

Marks:
- Bar chart: horizontal pills 40px tall with fully rounded ends (radius 20). Under each, the same pill in the lip color offset 5px down, like a pressed button. A 5px white highlight strip at 22% opacity inset 14px from the ends, 7px below the top. Values inside, right-aligned 18px before the end, in white 900.
- Line chart: 4px lines per category in the same colors with round caps, 10px dots with a 3px lip-colored ring, and the code badge plus value as a direct label at each line's end.

Avoid: gradients, thin bars, axis lines, legends (the badges and names label every row), pastel versions of the colors, and dark text inside the bars.

When you're done, render the chart and check that white values stay legible inside every bar, the shortest bar still fits its value, the lips line up under their pills, and the title's comparison matches the data.