FluidCAD

Getting Started · Tutorials · Guides

FluidCAD is under active development. APIs and features may change as the project evolves.

I'm not accepting pull requests just yet -- I'm still finalizing the design and putting together a roadmap. Once I hit v0.1.0, I'd love to have contributions from the community. Stay tuned!

Under the Hood

FluidCAD is built on OpenCascade, a full B-Rep (boundary representation) modeling kernel, through the opencascade.js WebAssembly binding. This means precise, production-grade geometry -- exact edges, fillets, and booleans -- not mesh approximations.

A huge thanks to the opencascade.js team for making this possible.

Features

Code-Driven 3D Modeling

Design parametric 3D models using JavaScript. Every change in your code is reflected instantly in the 3D viewport.

import { extrude, fillet, sketch } from 'fluidcad/core';
import { circle } from 'fluidcad/core';

sketch("xy", () => {
    circle(50)
})

const e = extrude(50)

fillet(5, e.startEdges())

Traditional CAD Workflow

A modeling workflow that feels familiar to users of mainstream CAD software -- sketches, extrusions, fillets, shells, booleans, and more -- all driven by code.

Modeling History

Navigate through your modeling history step by step. Review how any model was built and roll back to any point in the feature tree.

Model with the Mouse

Prefer clicking? Pick geometry in the viewport, fill in a dialog, and FluidCAD writes the statement into your file -- sketches, extrude, revolve, sweep, loft, shell, fillet, chamfer, repeat, booleans and more. Double-click a timeline row to reopen the same dialog and edit that feature in place.

It's a companion to the code, not a replacement: everything it produces is ordinary FluidCAD code you can keep editing by hand.

Feature Transforms

Re-apply modeling features based on matrix transformations. Move, rotate, or mirror entire feature sequences to build complex geometry from simple building blocks.

sketch("xy", () => {
    rect(200, 100).centered()
})

const e1 = extrude(20)

sketch(e1.endFaces(), () => {
    circle([-80, 30], 30)
});

const pin = extrude(10)

const f = chamfer(2, pin.endEdges());

repeat("linear", ["x", "y"], {
    count: [4, 2],
    length: [160, -60]
}, pin, f)

Pattern Copying

Duplicate features in linear or circular patterns to quickly populate repetitive geometry.

Smart Defaults

Most operations just do the right thing without extra arguments. extrude picks up the last sketch, fillet targets the last selection, and touching shapes are automatically fused -- less boilerplate, more readable code.

STEP Import / Export

Import and export STEP files with full color support. Bring in existing CAD models or share your designs with any standard CAD tool.

Use Your Favorite Editor

FluidCAD ships official extensions for VS Code and Neovim, but works with any editor -- just point the CLI at your project.

LLM / AI Agent Integration (MCP)

FluidCAD ships an MCP server so AI agents (Claude Code, Claude Desktop, Cursor, opencode, etc.) can drive a running workspace -- take screenshots, inspect geometry, edit .fluid.js files, and look up the API by symbol. See Set Up the MCP Server below.

Tutorials

Step-by-step tutorials from simple shapes to exam-level parts. Browse all tutorials →

Getting Started

1. Create a New Project

mkdir my-app && cd my-app
npm init -y
npm install fluidcad
npx fluidcad init

This generates init.js and jsconfig.json to get you started.

2. Set Up Your Editor

{
  "Fluid-CAD/FluidCAD",
  config = function()
    require("fluidcad").setup()
  end,
  ft = { "javascript" },
}

npx fluidcad serve

3. (Optional) Set Up the MCP Server

FluidCAD bundles an MCP server so LLM agents can drive your workspace -- screenshots, geometry inspection, source edits, API lookup. It's included in the fluidcad package; no separate install needed.

Wire it into your MCP client:

claude mcp add --scope user FluidCAD -- npx -y fluidcad mcp

{
  "mcpServers": {
    "FluidCAD": {
      "command": "npx",
      "args": ["-y", "fluidcad", "mcp"]
    }
  }
}

{
  "$schema": "https://opencode.ai/config.json",
  "mcp": {
    "FluidCAD": {
      "type": "local",
      "command": ["npx", "-y", "fluidcad", "mcp"],
      "enabled": true
    }
  }
}

Then install the companion skill so agents follow the FluidCAD workflow:

npx skills add Fluid-CAD/FluidCAD

See the MCP README for the full tool surface, transport details, and local-testing guide.

4. (Optional) Export from the Command Line

Turn a model into a STEP, STL, or PNG without leaving the terminal:

npx fluidcad export step                     # every shape -> <entry>.step
npx fluidcad export stl --resolution fine
npx fluidcad export png --view front --open

If a FluidCAD server is already running for the project (started by serve or an editor extension), the CLI exports the scene that server is showing. Otherwise it starts one, renders your model, exports, and shuts it down again.

Options (all three formats):

step and stl add --shapes (a subset, by position, feature name, or id) and --list-shapes. step adds --no-colors. stl adds --resolution coarse|medium|fine|custom plus --linear-deflection <mm> / --angular-deflection <deg>. png adds --view, --width, --height, --transparent, --show-axes, --no-grid, --no-auto-crop, --no-fit, --margin, and --open.

PNG needs a browser. Screenshots are rendered by the FluidCAD viewport itself, so a browser has to be connected to the server. Pass --open and the CLI launches one for you.

Run npx fluidcad export step --help (or stl / png) for the full flag reference.

License

MIT