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

Quake Depths bar chart, dark theme: Depth histogram hanging from a surface line, graded pale to deep amber.

Quake Depths

DarkBar

Depth histogram hanging from a surface line, graded pale to deep amber.

  • Slate#141A20
  • Pale amber#FFE3A3
  • Deep orange#E0661B
  • Chamber orange#F2A65A
  • Surface white#EDE6D8

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 "Quake Depths" 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 cross-section card from a volcano observatory. A dark gray-blue slate with the chart hanging from a surface line like a borehole log, warm amber graded with depth, and one dashed line that tells the geological story.

Colors (use these exact values):
- Background: #141A20 (dark gray-blue).
- Sequential ramp for the bars by position, from the top category to the bottom: #FFE3A3 (pale amber) to #E0661B (deep orange), interpolated evenly in RGB.
- Reference line and its heading: #F2A65A (warm orange), with a soft gradient wash of the same color below the line (16% opacity fading to 0 at the bottom).
- Surface line and values #EDE6D8; secondary text and axis #8C97A3; faint gridlines #2A333D; source #6B7682.

Typography (Google Fonts):
- Pathway Gothic One throughout (a single weight; use size and case for hierarchy). Title 40px #EDE6D8 with 0.3px letter-spacing, stating the finding; subtitle 19px #8C97A3; category labels 16px right-aligned; value labels 17px #EDE6D8; count scale labels 15px; reference heading 18px uppercase with 1px letter-spacing; notes 16px; source 15px.

Layout:
- 56px side margins; title near y 70, subtitle near y 102.
- A 1.4px #EDE6D8 surface line across the full width at y 160; the count scale labels sit above it.
- Category labels in a column ending at x 136; a 1px vertical axis at x 150; bars grow rightward from it up to about x 700, leaving the right side for notes.
- A thin downward arrow (1.2px #8C97A3) with a rotated "DEPTH INCREASES" label (15px, 1.4px letter-spacing) at the far left.

Axes and grid:
- Depth (or the category axis) runs top to bottom, increasing downward. Count gridlines are vertical, 1px #2A333D dashed (2 on, 4 off), labeled above the surface line; the zero label reads "0 EVENTS".

Marks:
- Bar chart: horizontal bars with square corners, bar height = row pitch minus 6px, colored along the ramp. Value labels 8px past each bar end. The reference line is a 1.6px #F2A65A dashed (7 on, 5 off) horizontal line at its exact value, broken where it would cross a value label; heading and notes right-aligned below it at the right margin. One short 1px leader line to a note about the largest shallow cluster.
- Line chart: a vertical profile: depth down the y axis, the measure on x, a 2.5px line colored with the same pale-to-deep amber gradient along its length, small 4px dots at each sample, the same surface line, dashed reference line and wash.

Avoid: bars growing upward, rainbow ramps, bold weights (the font has one), gridlines crossing the notes area heavily, and rounded bars.

When you're done, render the chart and check that depth increases downward, the ramp runs pale to deep in order, the dashed line sits at its exact value, and no value label touches the dashed line or a note.