Isometric blocks

An isometric block chart: a floor grid, then a row of blocks rising to their values one after another, the tallest in the accent, each with its value on top and its label on the floor.

  • 3d/iso-blocks
  • 3D
  • chart
  • Full frame
  • 5 s (3–30 s)
  • 3D kit
Style
Live in your browser
Isometric blocks at 16:9
0.00 / 5.00 s
npx volito render 3d/iso-blocks --style ember --out iso-blocks.mov
Playing live with volito/browser, the engine a render uses. Each tab lays the item out again for that shape, not a crop.

Render it

npx volito render 3d/iso-blocks --prop title="Renders per day" --out iso-blocks.mov

That writes ProRes 4444. The same item in another shape, brand or format:

volito render 3d/iso-blocks --aspect 9:16 --style cobalt --out iso-blocks-9x16.mov
volito render 3d/iso-blocks --format mp4 --out iso-blocks.mp4
volito still 3d/iso-blocks --t 2.5 --out iso-blocks.png
volito info 3d/iso-blocks     # every prop and part
volito add 3d/iso-blocks      # copy its source into ./motion to edit

From Node:

import { findItem, renderVideo } from "volito";

await renderVideo(findItem("3d/iso-blocks"), { props: { title: "Renders per day" }, out: "iso-blocks.mov" });

Or ask an agent with the MCP server connected: “Render the Volito isometric blocks (3d/iso-blocks) in 9:16, in our brand.”

Props

Set each with --prop name=value, or all at once with --props and a JSON object.

PropTypeDefaultTakes
titletextRenders per day≤ 50 chars
rows
Blocks (Label: value)
list{"label":"Mon","value":120}; {"label":"Tue","value":180}; {"label":"Wed","value":150}; {"label":"Thu","value":260}; {"label":"Fri","value":210}—
suffix
After values
text—≤ 6 chars

Parts

Each part takes any move, ease or idle: --motion ground.in=pop.

PartWhat it is
groundthe ground
titlethe heading
floorthe floor
blocksthe blocks

Tags: isometric, 3d chart, blocks, bars, data

More in 3D