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

Rate Limit Docs line chart, light theme: Developer docs page with a left nav, a sawtooth quota line and a red 429 floor.

Rate Limit Docs

LightLine

Developer docs page with a left nav, a sawtooth quota line and a red 429 floor.

  • Royal blue#2563EB
  • Status red#DC2626
  • Code block#EFF6FF
  • Nav gray#6B7280
  • Ink#111827

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 "Rate Limit Docs" 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 page from well-made API developer documentation. White, quiet and exact: a top bar with doc tabs, a thin left nav, monospace labels that read like HTTP headers, one royal blue data color and one red failure line.

Colors (use these exact values):
- Page: #FFFFFF. Rules and the top bar's bottom border: #E5E7EB. Faint gridlines: #F3F4F6.
- Primary data mark: #2563EB (royal blue), with an area fill fading from 14% to 2% opacity of the same blue.
- Failure threshold and error text: #DC2626 (status red); empty or failing periods get a #DC2626 tint at 6% opacity.
- Code-block caption band: #EFF6FF fill with a 1px #DBEAFE border; header text inside in #1E3A8A.
- Title ink #111827, body text #374151, nav links and axis labels #6B7280, faint labels #9CA3AF.
- Method badges: POST text #B45309 on #FEF3C7, GET text #15803D on #DCFCE7.

Typography (Google Fonts):
- Schibsted Grotesk for the product name (700, 14.5px), doc tabs (13px, 600 active / 500 others), nav links (13px, 400; active 600 in blue), title (700, 27px, -0.5px letter-spacing, stating the finding), subtitle (400, 14px #374151) and footer (500, 11.5px #9CA3AF).
- Source Code Pro for everything technical: breadcrumb (500, 11.5px), nav section heads (600, 10.5px uppercase, 1.2px letter-spacing, #9CA3AF), legend entries written as header names (500, 12px), axis tick labels (400, 11px), method badges (700, 11px) with paths (500, 11px), and the caption band (12 to 12.5px).

Layout:
- A 52px top bar with a 1px bottom rule: a 22px rounded blue square logo and product name at left, doc tabs starting where the content column starts (active tab in ink with a 2px blue underline sitting on the rule), and a pale blue "API v2.4" pill at right.
- A left nav column about 196px wide under the top bar, separated by a 1px #E5E7EB vertical rule. Section heads in mono caps; links hang off a 1.5px #E5E7EB vertical tree rail at x 29; the active link gets a 3px blue segment on the rail, blue 600 text, and three indented mono sub-links under it.
- Content column from x 262: mono breadcrumb, title about 34px below it, subtitle, then a legend row, then the chart (plot about 262 to 884 wide, 224 to 436 tall).
- Under the chart a code-block caption band (8px radius, 64px tall) spanning the content column, holding an HTTP status line in red, a line of response headers separated by " · ", and a "# comment" line in gray summarizing the finding.
- Footer: "Source: ..." at left, "Was this page helpful? Yes / No" at right.

Axes and grid:
- Y labels right-aligned 10px left of the plot, formatted with thousands separators, in mono #6B7280. Horizontal #F3F4F6 gridlines; the limit or ceiling line is dashed 4 4 in #E5E7EB.
- X ticks 5px long in #9CA3AF under the baseline with mono time labels centered 22px below it.
- The zero or failure line is a 2px #DC2626 rule across the plot, with a red 34 x 18 tag (4px radius) at its right end reading the status code ("429") in white mono 700.

Marks:
- Line chart: a 2.25px #2563EB line with straight segments and miter joins. When the series resets (quota windows, sprints, billing cycles), draw the reset as a vertical jump and mark each reset top with a 3px white dot with a 1.75px blue ring, so the line reads as a sawtooth. Periods stuck at zero get a pale red tint band and a small red mono duration label ("5 min") just above the floor.
- Bar chart: slim #2563EB bars with 3px top radius and about 40% gaps, the pale blue gradient behind nothing; bars at or below the failure threshold turn #DC2626, and the threshold is the same 2px red line with its status tag.

Labels and annotation:
- Annotate the cause of each event with an HTTP method badge: a 22px-tall white pill with a #E5E7EB border, the colored method segment on its left, the monospace path on its right, and a 1px dashed connector down to the mark.
- Legend entries are 20px line swatches followed by the header-style name ("X-RateLimit-Remaining").

Avoid: dark mode, shadows, gradients other than the faint area fill, rounded chart frames, more than one data hue, serif type, and prose-style labels where a header name or path would do.

When you're done, render the chart and check that the badges don't touch the top of the line, the red status tag fits inside the canvas, mono text is not collapsing double spaces (use " · " separators), and every number in the title and caption band matches the data.