marimo-cad

Reactive Parametric CAD for marimo notebooks.

Built on build123d + three-cad-viewer.

Build interactive 3D CAD models with sliders that update in real-time without losing your camera position.

Why marimo-cad?

Installation

uv add marimo-cad

Quick Start

import marimo as mo
from build123d import Box
import marimo_cad as cad

size = mo.ui.slider(10, 50, value=20, label="Size")
viewer = cad.Viewer()

box = Box(size.value, size.value, size.value)
viewer.render(box)

mo.vstack([size, viewer])

Examples

See notebooks/ for complete examples:

• bookshelf.py - Parametric bookshelf
• vase.py - Parametric vase with STL export

Viewer Features

• Mouse: Rotate (drag), pan (right-drag), zoom (scroll)
• Tree view: Toggle part visibility
• Clipping planes: Slice along X/Y/Z
• Measurement: Distance and angles

Limitations

• Large models (>100k triangles) may be slow to tessellate
• Selection events not yet exposed to Python

Development

uv sync && cd js && npm install && npm run build && cd ..
uv run pytest tests/           # 34 tests
uv run ruff check src/ --fix   # Lint

API Reference

Viewer

viewer = cad.Viewer(width="100%", height=600)
viewer.render(shapes)

render(shapes) - Render shapes, preserving camera position.

# Single shape
viewer.render(box)

# Multiple shapes
viewer.render([box, cylinder])

# Named parts with colors
viewer.render([
    {"shape": base, "name": "Base", "color": "blue"},
    {"shape": top, "name": "Top", "color": "red", "alpha": 0.8},
])

PartSpec

Dict for specifying parts with metadata:

COLORS

Available named colors: blue, red, green, yellow, orange, purple, cyan, pink, gray, white, black

{"shape": box, "color": "blue"}      # Named
{"shape": box, "color": "#ff6600"}   # Hex

Export Functions

from marimo_cad import export_stl, export_step, export_gltf

export_stl(obj, "part.stl")                    # 3D printing
export_stl(obj, "fine.stl", tolerance=0.0001)  # Higher resolution
export_step(obj, "part.step")                  # CAD interchange (lossless)
export_gltf(obj, "part.glb")                   # Web viewers

All return Path to exported file.

How It Works

1. Tessellate: build123d → triangle meshes (ocp-tessellate)
2. Transport: Mesh data → JavaScript (anywidget)
3. Render: Three.js via three-cad-viewer
4. Update: render() updates geometry, camera preserved

License

MIT