technicaldiagrams.comv0.1 · visual references for agents
← Charts

Heatmap

Reveal concentration across a two-dimensional grid.

Visual 87/100Edit 84/100Balanced 86/100Editorial baseline · revision 1
HeatmapScan relative workload by day and time bucket. All values are illustrative example data.When the queue is busiestIllustrative jobs per bucket · values shownMon27148362Tue50471695Wed83704928Thu16037251Fri493605840003060912151821
Live SVG · all content is illustrative

Make it yours

Edit labels & content

Change the text directly. Use the scene editor to move or add elements.

Edit individual elements

Choose a shape or text element, then change its properties. Related labels and connectors have separate coordinates.

Edit scene JSON

Change positions, dimensions, paths, and labels. Apply validates the scene before changing the preview. Primitive reference ↗

Review this diagram

Your scores and review history stay in this browser. Export reviews to propose a catalog update. Read the rubric.

    Use this when

    Scan relative workload by day and time bucket.

    Choose another form when

    Readers need exact values or a color-free comparison.

    Built from

    MatrixLabel

    A regular grid edits well; intensity needs a legend and textual values.

    Initial editorial assessment by Codex · 2026-09-07. Scores are judgments about this example, not a benchmark of AI capability.

    Give your agent this reference

    Use the example to show your agent the form you want. Describe your system or provide your source material, then ask it to generate an adapted diagram and inspect the result.

    Includes the reference URL, current scene, and settings. Paste it into your own agent.

    Read the agent workflow ↗

    Take the source

    The SVG is self-contained. The JSON preserves editable primitives and your presentation settings. Labels remain text; shapes remain vectors.

    Original scene JSON ↗
    Controls, limits, and embedding ↗