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

Haul Cycle line chart, dark theme: A truck-cab display with an amber stepped line, hatched pauses and a big readout.

Haul Cycle

DarkLine

A truck-cab display with an amber stepped line, hatched pauses and a big readout.

  • Cab charcoal#16181A
  • Panel#1D2023
  • Amber#F5A524
  • Display white#E8E6E1

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 "Haul Cycle" 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: the in-cab display of a heavy haul truck. Charcoal glass, squared-off techno numerals and a single amber accent. Big readouts you can read at a glance while driving; everything else stays neutral gray.

Colors (use these exact values):
- Background: #16181A. Panels: #1D2023. Gridlines and hatching: #2C3034.
- Primary text and the target line: #E8E6E1. Secondary text: #8E9296.
- Accent: #F5A524 (amber), the only color: the data line, markers, the eyebrow, and the frame of the headline readout.

Typography (Google Fonts):
- Oxanium for everything. Eyebrow 600 12px uppercase with 2px letter-spacing (site in amber, unit id in #8E9296); title 700 30px stating the finding; subtitle 400 15px #8E9296.
- Stat labels 600 11px uppercase, 1.5px letter-spacing, values 600 20px. Headline readout 700 56px with a 500 20px unit suffix. Axis labels 500 13px. Legend and footer 500 11px uppercase with 1.2 to 1.5px letter-spacing.

Layout:
- 56px margins. Title block top-left with a row of three small stats (count, total, pause length) under it at y 140.
- A 196 x 128 headline readout panel in the upper right: #1D2023 fill, 1.5px #F5A524 border, 6px radius, amber label, huge value, target underneath.
- Plot panel #1D2023 with 6px radius, x 96 to 830, y 212 to 500; the target label sits outside the plot on the right as two stacked lines. Legend and source on one line at y 568.

Axes and grid:
- 1px #2C3034 horizontal gridlines every 10 units; y labels right-aligned 12px left of the panel, unit letter above. Time ticks every 2 hours below the panel (6px, #8E9296).
- Pauses (refuelling, breaks) are hatched panels: 45-degree 3px #2C3034 stripes every 8px across the full plot height, labeled with a 700 11px name and a 10px duration at the bottom.

Marks:
- Line chart: a stepped line (horizontal hold, then vertical jump) 2.4px #F5A524 with miter joins, broken across pauses. A 6px square marker at each step start: solid amber when on or above target, background-filled with a 1.5px amber outline when below. Target as a 1.2px #E8E6E1 dashed line (6 on 5 off) at 70% opacity.
- Bar chart: one slim square-cornered column per cycle, solid #F5A524 when on or above target and #F5A524 outline only (1.5px) when below, with the same dashed target and hatched pause gaps.

Avoid: any second hue, gradients, glows, drop shadows, rounded data marks, and a chart title in amber.

When you're done, render the chart and check that the headline average and hit count match the data, the line truly breaks at pauses, the only colored elements are amber, and nothing in the header overlaps the readout panel.