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

Fold Change bar chart, dark theme: Diverging gene bars from a bright spine, italic serif names and significance stars.

Fold Change

DarkBar

Diverging gene bars from a bright spine, italic serif names and significance stars.

  • Graphite#17181C
  • Up red#E0584B
  • Down blue#4F8DE0
  • Spine#C9CCD2
  • Label ink#ECEDEF

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 "Fold Change" 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 differential expression figure in a dark journal supplement. Symmetric and literate: a bright center spine, warm up and cool down, italic serif names and a column of significance stars.

Colors (use these exact values):
- Page: #17181C (graphite).
- Positive: #E0584B (warm red). Negative: #4F8DE0 (blue). Items that miss significance keep their color at 38% fill opacity with muted labels.
- Zero spine: #C9CCD2. Text: #ECEDEF. Secondary text: #8E929B, with #6A6E77 for secondary tick captions. Gridlines: #2A2C33.

Typography (Google Fonts):
- Newsreader 500, 30px, #ECEDEF for the title stating the finding; Newsreader italic 400, 15px for item names (gene names).
- Lato for everything else: subtitle 14px #8E929B; direction headers and column header 700 11px uppercase, 1.6px letter-spacing ("DOWN IN TREATED" in blue, "UP IN TREATED" in red); values 700 12px in the bar color with a true minus sign; stars 900 15px; tick labels 700 12px with captions ("4x up") in 11px below.

Layout:
- 56px margins. Title and subtitle at the top, then direction headers just above the chart on either side of the spine.
- Chart from x 150 to x 830 with zero at the center; a narrow significance column centered at x 870 under a "PADJ" header.
- A footer line: "Source: ..." followed by the star key and the significant count, in 12px #8E929B.

Axes and grid:
- 1px #2A2C33 vertical gridlines at symmetric steps (-4, -2, 2, 4). A 1.5px #C9CCD2 zero spine running the full height.
- Tick labels under the chart ("+2", "0", "−2") with a fold caption beneath each.

Marks:
- Bar chart: diverging horizontal bars 11px thick on an 18.5px row pitch, square corners, sorted from the largest positive to the largest negative. Each name sits on the opposite side of the spine, 10px away (right-aligned for positive bars, left-aligned for negative ones). Values 8px beyond the bar tip. Stars in the fixed right column: *** below 0.001, ** below 0.01, * below 0.05.
- Line chart: a 2px #C9CCD2 line on a symmetric scale around a bright zero line, with the region above zero tinted #E0584B at 12% and below tinted #4F8DE0 at 12%, points as 4px dots colored by sign, and the same star column or stars above significant points.

Avoid: gradients, rounded bar ends, a legend box, labels overlapping bars, and asymmetric axis ranges.

When you're done, render the chart and check that the counts in the title match the data, names never overlap bars, stars match the p-values, and the longest bars and their values stay inside the canvas.