npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2026 – Pkg Stats / Ryan Hefner

fluidcad

v0.0.48

Published

Parametric CAD modeling library using javascript

Readme

Pull requests are not being accepted yet while the design and roadmap take shape. Community contributions are planned for v0.1.0.

FluidCAD is under active development; APIs and features may change.

FluidCAD is an open-source CAD app for designing parts and moving assemblies. Sketch, constrain, and shape your model in a live 3D workspace, with ordinary JavaScript behind every feature. Change a dimension, reuse a part, or automate a pattern. The model rebuilds with you.

See what you can build

From sketches to solid parts

Draw a profile and extrude it, revolve it around an axis, or sweep it along a path. Refine the result with cuts, fillets, chamfers, shells, and booleans; repeat features in linear, circular, or mirror patterns.

Use the toolbar to create features and FluidCAD writes the code. Double-click a feature in the timeline to edit it, or step back through the history to see how the model was built.

Sketches that keep their shape

Dimensions and constraints capture your design intent: keep holes concentric, sides parallel, or an arc tangent to a line. The solver maintains those relationships as you drag, while snapping adds constraints as you draw.

Readable code, reusable designs

A model is a JavaScript file you can inspect, edit, and version with Git. Here is a complete mounting plate: sketch an outline, add thickness, then cut two holes.

import { part, param, sketch, extrude, circle, cut } from 'fluidcad/core';
import { rect } from 'fluidcad/shapes';

export const plate = part('Mounting plate', () => {
  const thickness = param('Thickness', 6);
  const holeDiameter = param('Hole diameter', 5);

  // Sketch the outline, then give it thickness.
  sketch('xy', () => {
    rect([0, 0], 80, 40).centered();
  });
  const body = extrude(thickness);

  // Sketch on the top face and cut through the plate.
  sketch(body.endFaces(), () => {
    circle([-25, 0], holeDiameter);
    circle([25, 0], holeDiameter);
  });
  cut(thickness);
});

Save this as plate.part.js. Adjust Thickness or Hole diameter in the Parameters panel to resize the part; body.endFaces() keeps the holes on its top face. Dimensions use your project’s units (millimeters by default). Assemblies can override these parameters per instance.

Parts that work together

Insert parts into an .assembly.js file and connect them with mates. Build a hinge with a revolute joint, a carriage with a slider, or a mechanism with several linked parts. Drag it to explore its motion, set joint limits, or animate it from the Joints panel.

Reuse sub-assemblies and replicate them across a design, like the piston assemblies in this engine. Explore assemblies →

From everyday objects to mechanical parts

Build a lantern, a tray, or a mechanical part by following a complete tutorial. Each takes you from the first sketch to the finished model.

Bring in existing STEP models with their colors, export STEP to other CAD tools, or export STL for 3D printing. Assembly STEP exports preserve the part tree, and PNG export gives you an image to share.

Download

Download the latest release, install it, and open a project folder.

| Platform | Package | Installation | | --- | --- | --- | | Windows (x64) | .exe | Run the installer. If SmartScreen appears, choose More info → Run anyway; builds are not yet code-signed. | | Linux (x64) | .AppImage or .deb | Make the AppImage executable and run it, or use sudo apt install ./FluidCAD-*.deb. | | macOS (Apple Silicon) | .dmg or .zip | Drag FluidCAD into Applications. |

Prefer the terminal?

With Node.js and npm installed, the desktop app's start screen opens in your browser from any folder:

npx fluidcad

Create or open projects there; each opens in a tab of its own. To set a project up from the terminal instead:

mkdir my-model && cd my-model
npm init -y
npm install fluidcad
npx fluidcad init
npx fluidcad serve

This creates a project with an empty part, part1.part.js, and opens the workspace in your browser. Both the desktop app and browser workspace include a code editor and a live 3D viewport.

Start with the getting-started guide to build a hinge, or choose a tutorial.

Docker

To keep your projects in one place on a server, run the start screen in a container. Pick the example that matches your network, save it as compose.yaml, and run docker compose up -d. To build the image yourself from a clone of this repository, replace image: with build: ..

On a network you trust (home LAN, Tailscale), with no sign-in:

services:
  fluidcad:
    image: ghcr.io/fluid-cad/fluidcad:latest
    ports:
      - "3100:3100"
    environment:
      FLUIDCAD_NO_AUTH: "1"
      # Every name you open FluidCAD by; any other is refused.
      FLUIDCAD_ALLOWED_HOSTS: "fluidcad.example.com,192.0.2.20"
    volumes:
      - ./projects:/app/projects
      - fluidcad-home:/home/node/.fluidcad
    restart: unless-stopped

volumes:
  fluidcad-home:

Open http://fluidcad.example.com:3100 from any device. Anyone who can reach that port can read and change every project, and run code on the server through them, so don't expose it beyond that network.

On a shared network (office, school), behind an HTTPS reverse proxy on the same machine (Caddy, nginx, Tailscale Serve) that forwards WebSocket upgrades:

services:
  fluidcad:
    image: ghcr.io/fluid-cad/fluidcad:latest
    ports:
      - "127.0.0.1:3100:3100"
    environment:
      FLUIDCAD_PUBLIC_URL: "https://fluidcad.example.com"
    volumes:
      - ./projects:/app/projects
      - fluidcad-home:/home/node/.fluidcad
    restart: unless-stopped

volumes:
  fluidcad-home:

The port is published on 127.0.0.1, so only the proxy on the same machine reaches it. Sign in with the link from docker compose logs fluidcad, once in each browser. The link changes every time the container starts.

FluidCAD is not built to face the internet: keep it on a network you control, and reach it from outside through a VPN such as Tailscale.

In both, ./projects holds your projects and must be writable by uid 1000 (sudo chown 1000:1000 projects on Linux). The fluidcad-home volume keeps engines downloaded for projects pinned to another FluidCAD version, recent projects and previews.

Fits your workflow

Editors

Keep npx fluidcad serve running beside any editor; the viewport updates when you save.

AI agents

The bundled MCP server lets agents inspect geometry, take screenshots, edit model files, and look up the API in a running workspace. Configure your MCP client to run:

npx -y fluidcad mcp

The server also serves the companion modeling skills to the agent (read_skill), so they always match the running version; clients with native skill support can additionally install them with npx skills add Fluid-CAD/FluidCAD for automatic triggering. See the MCP setup guide for client configuration and usage.

About the project

FluidCAD uses the OpenCascade B-Rep modeling kernel through opencascade.js for precise solid geometry. Thanks to the opencascade.js team for making it available in WebAssembly.

Licensed under MIT.