Getting Started#

Magic Builder 3D lets you create parametric 3D models directly in your browser using JavaScript and the manifold3d engine. No software installation required.

• What is a parametric model?
• How it works
• Your first model
• Combining shapes
• Returning your model

What is a parametric model?#

A parametric model is defined by parameters — numerical or text values that you can change to modify the shape. For example, a box with parameters width, depth, height lets any user resize it without touching the code.

How it works#

1. Write JS code using the built-in helper functions (see JS Functions)
2. Define parameters that users can adjust
3. Publish your design — visitors can configure it and download the STL

Your first model#

Start by adding three parameters in the Parameters tab. Give each one an ID, set the type to number, and set the default value directly in the form:

Then write your JS code — the parameter IDs are available directly as variables:

const result = box(width, depth, height);

Click Refresh to see the preview.

Combining shapes#

const base  = box(40, 40, 5);
const tower = cylinder(8, 30).translate([0, 0, 5]);

const result = base.add(tower);

Use .add() for union, .sub() for difference, .intersect() for intersection.

Returning your model#

Your script must expose the final 3D shape by assigning it to const result. The engine reads this variable to generate the preview and STL export.

// Always end your script with:
const result = yourShape;

Do not use return — Magic Builder 3D reads const result at the end of your script.