iso-engine
Structure & live data — isometric SVG
Stack racks, manifolds, topology, and live status on one isometric scene. A visualization layer for light digital twins, ops sandboxes, and dashboards — pure SVG, no Canvas / WebGL.
Made with iso-engine
One set of composites for software ingress, AI inference, and plant floors — rounded boxes and cylinders as the base, domain shapes for contrast.
Live peek
The same shapes with live status and metrics. Structure once, telemetry forever — software runtime and light digital twins share one path.
What is iso-engine?
A pseudo-3D isometric engine: geometry lives in 3D space, rendered as pure SVG faces. Build interactive structure views and overlay live data on the shapes.
- Scene.Racks, manifolds, topology — structure you can read; status, flow, alerts — data you can overlay.
- Round.Cylinders and pipes are true rounds with volumetric elbows — not jagged polygons.
- Friendly.
renderRoundedBoxor<iso-rounded-cube>— tweak attributes and it draws.
Hello world
import { renderRoundedBox } from 'iso-engine'
const { svg } = renderRoundedBox({
width: 120, height: 120, depth: 72, radius: 24,
color: '#ef5510', material: 'plastic', shadow: true,
})
document.querySelector('#box').innerHTML = svgShape workshop
Live controls for a single rounded box or cylinder.