Isometric Conveyor
An isometric conveyor — raw blocks ride the belt, pass under the gate, and come out the other side wearing the accent. A pipeline / ETL illustration.
Installation
▸ Run the following command
npx shadcn@latest add https://www.mellowui.com/r/isometric-conveyor.json▸ Or install manually
- Copy the source from the Code tab above.
- Place it at
components/mellow/isometric-conveyor.tsx - Import and use.
API Reference
| Prop | Type | Default | Description |
|---|---|---|---|
| blocks | number | 3 | Number of blocks riding the belt. |
| speed | number | 46 | Belt speed in world units per second. |
| accent | string | "oklch(0.65 0.25 250)" | Color blocks take on after passing the gate. |
| size | number | 420 | Rendered width in px. |
| className | string | — | Additional CSS classes. |