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

Outage Plan bar chart, light theme: Cream planning board with slate planned outages and red-hatched forced ones.

Outage Plan

LightBar

Cream planning board with slate planned outages and red-hatched forced ones.

  • Cream board#F5F3EC
  • Month tint#ECE8DC
  • Planned slate#4E6A8C
  • Forced red#C8433A
  • Ink#23262B

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 "Outage Plan" 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 plant maintenance planning board pinned up in the outage coordinator's office. Cream paper, condensed type, calm slate for what was planned and an alarming red hatch for what wasn't.

Colors (use these exact values):
- Page: #F5F3EC (pale cream). Alternate month (or period) columns tinted #ECE8DC.
- Planned outages: #4E6A8C (slate blue). Completed ones solid; scheduled future ones at 35% fill opacity with a 1.2px #4E6A8C outline.
- Forced outages: diagonal hatch of #C8433A stripes (2.2px stripes on a 5px pitch, rotated 45 degrees, over the cream) with a 1.2px #C8433A outline.
- Ink and the today marker: #23262B. Secondary text: #6B6A64. Row rules: #D6D1C2.

Typography (Google Fonts):
- Roboto Condensed throughout. Eyebrow 12px 700 uppercase, 1.8px letter-spacing, in #4E6A8C. Title 28px 700 #23262B stating the finding. Subtitle 15px 400 #6B6A64.
- Row names 17px 700 with a 12px 400 descriptor beneath. Month headers 11px 700 uppercase with 1px letter-spacing, centered in each column. Bar tags 12px: work scope in 700 #23262B followed by the duration ("41 d") in 400 #6B6A64.

Layout:
- 48px margins. A legend row under the subtitle with 22 x 12 px swatches: "Planned, complete", "Planned, scheduled", "Forced outage".
- Row labels in a left column (48 to 170px), the timeline from about 176 to 800px, and a right summary column with two right-aligned numbers per row: planned days in 17px 700 slate and forced days in 17px 700 red, with "planned" / "forced" in 11px beneath and a "DAYS" header.
- Rows 84px tall separated by 1px #D6D1C2 rules running full width.
- Footer with "Source: ..." left and a definition note right, 12px #6B6A64.

Axes and grid:
- No y axis. The month columns are the grid: full-height alternating tints starting 22px above the first row, labels just above the first rule.
- A 1.5px #23262B vertical today line from the top rule to 8px below the last row, ending in a filled #23262B tag ("TODAY 14 AUG", 11px 700 cream, 0.8px letter-spacing).

Marks:
- Bar chart (horizontal, Gantt-style): 26px tall square-cornered bars placed by start and end date. Each bar gets a 1px leader rising 18px from its left edge (slate or red to match) with the tag text 5px to its right and 7px above the bar. Keep tags from colliding with each other or the today line.
- Line chart: plot lines in #4E6A8C (2px, straight segments) on the same striped month columns; show any forced or abnormal period as a red-hatched band behind the line, plus the today line and tag.

Avoid: rounded bars, gradients, drop shadows, bright saturated fills other than the red hatch, gridlines on top of bars, and a boxed legend.

When you're done, render the chart and check that bar lengths match the dates, the summary numbers add up per row, the title's totals are arithmetically right, and no tag overlaps another tag or the today line.