Primitive types
Use one of these in type on every element.
rectangleellipsediamondtriangle
starhearthexagonpentagon
trapezoidparallelogramcrossbanner
cloudspeechBubblethoughtBubbleframe
bracketscylindercube
processdecisiondataterminator
documentpreparationmanualInput
linearrowcurvedArrowconnectorthickPath
textimageicontablerIcon
actorpengroup
Layout containers
Auto-arrange children. Use these for tidy rows, columns, and grids.
VStack
HStack
Grid
ZStack
Absolute
Fill and line styles
fillStyle
solidhachurecross-hatchzigzagdots
lineStyle
soliddasheddotted
Color palette
Tailwind-style tokens, prefer these over hex. Hover a swatch to see the token name.
Loading palette from schema.json...
Special
Default options
| Option | Default | Notes |
|---|---|---|
stroke | #000000 | Outline color. Accepts tokens or hex. |
strokeWidth | 2 | Pixel width. Typical range 1 to 4. |
fill | transparent | Interior color. |
fillStyle | hachure | See list above. |
roughness | 1.8 | 0 is clean, 3+ is very sketchy. |
bowing | 1.2 | Line curvature. |
seed | null | Optional integer for reproducible randomness. |
lineStyle | solid | See list above. |
Default text properties
| Property | Default |
|---|---|
fontSize | 16 |
fontFamily | Comic Sans MS |
align | left (also center, right) |
fontWeight | normal |
fontStyle | normal |
lineHeight | 1.4 |