Skip to content
FlowScript templates

Scene — stacked blocks (3D)

Demonstrates box3d, cylinder3d and plane3d with the painter's- algorithm depth sort. Typed FlowScript for 3-D scene composition. Keywords: 3D, scene, isometric.

Template previewFlowScript
Stacked blocks — 3D schematicABCStage 2DMast★

Make it your own.

// Demonstrates box3d, cylinder3d and plane3d with the painter's-
// algorithm depth sort. Use this as a starting point for any 3D
// schematic — buildings, packaging, modular architectures.

scene blocks {
  title: "Stacked blocks — 3D schematic"
  projection: isometric
  width: 760
  height: 520
  grid: true
  axes: false
}

// Ground plane.
plane3d { x: -1  y: 0  z: -1  w: 5  d: 5  fill: "#cbd5e1"  stroke: "#64748b" }

// Base layer of 4 boxes.
box3d { x: 0  y: 0  z: 0  w: 1  h: 0.6  d: 1  fill: "#22d3ee"  label: "A" }
box3d { x: 1.1  y: 0  z: 0  w: 1  h: 0.6  d: 1  fill: "#22d3ee"  label: "B" }
box3d { x: 0  y: 0  z: 1.1  w: 1  h: 0.6  d: 1  fill: "#22d3ee"  label: "C" }
box3d { x: 1.1  y: 0  z: 1.1  w: 1  h: 0.6  d: 1  fill: "#22d3ee"  label: "D" }

// Stack on top.
box3d { x: 0.4  y: 0.6  z: 0.4  w: 1.3  h: 0.8  d: 1.3  fill: "#a78bfa"  label: "Stage 2" }

// A cylinder mast.
cylinder3d { x: 1.05  y: 1.4  z: 1.05  r: 0.18  h: 1.4  fill: "#fb923c"  label: "Mast" }

// Crown box at the top.
box3d { x: 0.7  y: 2.8  z: 0.7  w: 0.7  h: 0.4  d: 0.7  fill: "#f43f5e"  label: "★" }

view stack: scene(blocks)