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

Midnight Glow line chart, dark theme: A dark dashboard card with a hero metric and a glowing gradient area.

Midnight Glow

DarkLine

A dark dashboard card with a hero metric and a glowing gradient area.

  • Page#070B16
  • Card#0F1528
  • Line#9D8CFF
  • Compare#5B6799
  • Positive#34D399
  • Text#F4F6FF

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 "Midnight Glow" 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 premium dark-mode analytics dashboard. Deep navy, one luminous violet line, a big headline number.

Colors (use these exact values):
- Page: #070B16. Card: #0F1528 with a 1px #1C2440 border, 20px radius and a deep shadow (0 16px 40px, black at 45%).
- Primary series: #9D8CFF, with a glow. Area fill: a vertical gradient from #8B7CFF at 38% opacity to 0.
- Comparison series (previous period): #5B6799, 1.5px, dashed 4/5.
- Gridlines: #1F2946 dashed 2/6. Text: #F4F6FF (hero), #C3C9E6 (legend), #8A93B5 (labels), #5E6892 (axes), #434C75 (source).
- Positive change: #34D399 text on a #34D399 pill at 14% opacity. Negative change, if needed: #F87171 on the same treatment.
- Additional series, in order: #9D8CFF, #38BDF8, #F472B6.

Typography (Google Fonts): Inter only.
- Metric label 15px 500. Hero value 48px 700, letter-spacing -1.5px. Delta pill 13px 600. Comparison text 14px. Legend 13px 500. Axis labels 13px.

Layout:
- Header block top left: metric label, then the hero value (the latest value), then the delta pill and "vs. previous period" text on the hero's baseline.
- Legend top right: a short line swatch for each series (solid for current, dashed for comparison).
- Plot below the header, full card width minus 40px padding. Source line bottom left.

Axes and grid:
- Horizontal dashed gridlines only. Compact currency labels ($38k) right-aligned left of the plot. X labels at a few evenly spaced dates. No axis lines.

Marks:
- Line chart: a 2.5px smooth (monotone) line with round caps and a glow (Gaussian blur of about 7px merged under the line). Gradient area underneath. Comparison series drawn first, underneath.
- Bar chart: bars in #9D8CFF with 6px top radius and a 0 to 40% vertical gradient of the same color, the latest bar at full opacity with the glow and earlier bars at 55% opacity.
- Show one static tooltip on a meaningful point: a vertical dashed #3B4670 cursor line, a 6.5px point with a #0F1528 fill and a 3px #C4B9FF ring, and a #182040 card (1px #2A3563 border, 10px radius) showing the date in 12px #8A93B5 and the value in 17px 600 #F4F6FF.

Avoid: pure black, pure white, bright gridlines, more than one glowing series, and 3D effects.

When you're done, render the chart and check that the tooltip doesn't cover the line, the glow isn't clipped at the plot edges, and the hero value matches the data.