Prism steps: an isometric SVG shape of wireframe prisms on a staircase
A staircase of 12 box-like prisms climbs from the lower left to the upper right, each drawn as a diamond top face with two side walls and a center edge. Nothing is filled, so the boxes overlap transparently and the whole thing reads like an architect's line drawing. Brick red 1.5 strokes on peach-tinted cream keep the technical subject warm; roadmaps, onboarding progress and anything about building step by step are its obvious homes.
Make it yours
Separate or merge the steps
Element count is 12, which already overlaps each prism with its neighbor. At 6 the boxes pull apart into distinct steps you could label one by one; at 30 they fuse into a dense ramp of lines.
Stretch the walls
Wall height follows Curvature, 40 in this preset. Near 0 the prisms flatten into thin slabs, like stacked cards; at 100 they become tall columns. Open space works on the footprint instead: raise it from 20 to 50 to make each step narrower.
FAQ
Is Prism steps real 3D?
Not in the technical sense. It is flat SVG line work drawn in an isometric-style projection, with no 3D engine, lighting or shading involved. That keeps the output sharp at any size. The trade-off is that you cannot orbit the staircase; Rotation spins the whole drawing in the plane, which can break the illusion of a ground level if pushed far from 0.
How it works
Choose a system
Pick one of 24 geometric systems, from Ray crown and Iris fold to Latitude cage and Twist tower.
Shape the geometry
Set density, detail, bend, openness, weight, scale, rotation and offset, and change the variation for a new arrangement.
Color, frame and use it
Set paper, primary, secondary and accent colors, choose landscape, square or portrait, then sign in with a free UX Pilot account to use it on the canvas or export it.