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

Digital Twin line chart, dark theme: Console with an isometric building wireframe and glowing per-floor lines.

Digital Twin

DarkLine

Console with an isometric building wireframe and glowing per-floor lines.

  • Deep blue-black#060D18
  • Sidebar#0A1426
  • Selected cyan#1FC8E6
  • Blue#3B7BF0
  • Violet#C98AFB

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 "Digital Twin" 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: an operations console for a building's digital twin. Deep blue-black, a wireframe model of the building in a sidebar with the selected part lit up, and softly glowing telemetry lines in the main pane.

Colors (use these exact values):
- Canvas: #060D18. Sidebar: #0A1426 with a 16px dot grid (0.8px #12203A dots) and a 1px #16264A divider. Plot panel: #081226.
- Selected series and all "selected" highlights: #1FC8E6 cyan. Other series: #3B7BF0 blue, #C98AFB violet.
- Wireframe edges #2A3F66, mullions #1D2F52. Gridlines #132341, vertical hour rules #0F1D38, zero line #2A3F66.
- Title #EAF2FF; subtitle #7F93B8; axis and small labels #5E7398; source #4C5F82; tag values #E6F0FF on #0B1A33.

Typography (Google Fonts):
- Exo 2 for all text. Title 700 26px stating the finding; subtitle 400 15px; sidebar name 700 14px uppercase with 2.5px letter-spacing; section labels 600 11px uppercase with 2px letter-spacing; axis labels 12px; tags 700 12px id plus 600 12px value.

Layout:
- A 270px sidebar on the left: building name, a short model line, a pill "LIVE SYNC" (24px tall, 12px radius, cyan 60% stroke, cyan dot), then an isometric wireframe of the building (six floors, 30-degree axes, back vertical edge dashed 3 3, window mullions on the right face). Fill the selected floor's two visible faces with cyan at 16% and 26% and its top at 10%, stroke its outlines 1.4px cyan, and tag it with a cyan leader and label to the right.
- Under the model, a "FLOORS" list: a 10 x 3 color bar, the series name, and its total right-aligned; the selected row gets a cyan 12% highlight.
- Main pane: title at x 310, y 58; subtitle at y 86; plot from x 330 to 850 and y 150 to 488, with telemetry tags in the right margin.

Axes and grid:
- 1px horizontal gridlines every 100 units, faint vertical rules every three hours, unit label "kW" above the y labels, hour labels "09:00" 22px under the plot.

Marks:
- Line chart: monotone smooth lines; the selected series 3.2px with a glow (Gaussian blur 5, merged under the line) and an area fill from cyan 22% to 0%; other series 1.8px with a softer glow (blur 2.5) at 90% opacity. Mark the selected series' peak with a ringed dot (r 4 core, r 9 halo at 45%) and a dotted drop line to the axis.
- Bar chart: slim bars with 2px top corners; the selected series cyan with the same glow, others blue and violet at 85% opacity; value tags on the selected series only.
- Telemetry tags at line ends: 84 x 24 dark chips (3px radius) outlined in the series color with a 3px color spine on the left, id on the left and "244 kW" on the right, dodged 30px apart and joined to the end dot by a thin leader.

Effects:
- Apply glows with filterUnits="userSpaceOnUse" covering the whole canvas so they never clip.

Avoid: light backgrounds, neon overload (only the selected series gets the strong glow), photographic textures, and a detached legend (the sidebar list and tags do that job).

When you're done, render the chart and check that the highlighted floor in the wireframe matches the selected series, the peak in the title matches the data, tags don't overlap, and glows are not cut off.