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

Signal Orange bar chart, light theme: Gray bars, one orange standout and a huge section number on warm gray.

Signal Orange

LightBar

Gray bars, one orange standout and a huge section number on warm gray.

  • Warm gray#E9E7E3
  • Mid-gray#9B9894
  • Signal orange#FF5A1F
  • Black#111111

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 "Signal Orange" 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 section opener from a corporate identity guidelines book. Everything is neutral gray except one mark in signal orange; a huge section number and a blunt one-sentence takeaway do the talking.

Colors (use these exact values):
- Page: #E9E7E3 (pale warm gray).
- Ordinary bars: #9B9894 (mid-gray).
- The one highlighted mark and its big value: #FF5A1F (signal orange). Also a 40 x 6px accent bar under the section number. Never use orange for more than one data mark.
- Black #111111 for the section number, takeaway, baseline, in-bar values, the highlighted category label and the footer rule.
- Muted text #5F5C57.

Typography (Google Fonts):
- Archivo Black for the section number (220px, -8px letter-spacing), the takeaway (29px, -0.6px letter-spacing, 34px line height, in sentence case) and the highlighted value (46px, -1.5px letter-spacing, orange).
- Archivo Narrow for everything else, tabular figures: section label 700 12px uppercase with 2.4px tracking; subtitle 400 15px muted; category labels 500 15px uppercase with 1.6px tracking (700 black for the highlighted one); in-bar values 700 14px black; the unit under the big value 700 12px uppercase with 2px tracking; footer 13px.

Layout:
- A left column about 260px wide starting at x 48: the huge numeral "4" at the top left (baseline about y 206), the orange accent bar, "SECTION 4 / MOVEMENT", the takeaway on four short lines, then the measure and period in the muted subtitle.
- The chart fills the right side from x 352 to 912, baseline at y 414.
- Footer: 1px black rule at y 540, "Source: ..." left and an uppercase document name with page number right in 700 black.

Axes and grid:
- No gridlines, no y-axis and no y labels: values sit on the bars.
- A thick 4px black baseline.
- Category labels rotated 90 degrees to read upward, their end anchored 16px below the baseline and centered on each bar.

Marks:
- Bar chart: square-cornered vertical bars about 68% of the band (54px at seven bars), all #9B9894 except the single key bar in #FF5A1F. Gray bars carry their value in black 700 14px just inside the top (22px below the bar top). The orange bar has no in-bar label; instead its value is set large in Archivo Black 46px orange just to the right of the bar top, with the unit ("STEPS A DAY") beneath it.
- Line chart: every series a 2.5px #9B9894 line except one 5px #FF5A1F line, on the same 4px black baseline with no gridlines. Only the orange line gets a large end value in Archivo Black; gray lines get small muted end labels.

Avoid: gridlines, legends, a second accent color, rounded corners, gradients, shadows and centered layouts.

When you're done, render the chart and check that exactly one mark is orange, the big value clears the neighboring bar or line, the rotated labels read bottom to top without touching the baseline, and the percentage in the takeaway is computed from the data.