# Implicit CAD with GLSL Signed-Distance Fields and Raymarch Rendering in text-to-cad

> Explore implicit CAD with GLSL signed-distance fields and raymarch rendering in the text-to-cad repository. Author 3D models, render in a browser, and export to GLB, STL, or 3MF.

- Repository: [earthtojake/text-to-cad](https://github.com/earthtojake/text-to-cad)
- Tags: deep-dive
- Published: 2026-08-03

---

**The text-to-cad repository provides a complete implicit CAD pipeline that lets you author 3D models using GLSL signed-distance functions, render them via GPU-accelerated raymarching in a browser-based viewer, and export production-ready meshes in GLB, STL, or 3MF formats.**

The text-to-cad project is an open-source workbench designed for AI-assisted mechanical design, bundling specialized *agent skills* that generate, visualize, and export CAD artifacts. Its **implicit CAD** system—located primarily in `skills/implicit-cad/`—enables developers to define solid geometry programmatically through **GLSL signed-distance fields (SDFs)** and visualize results instantly using a **raymarch rendering** engine, eliminating the need for traditional mesh editing workflows.

## How Implicit CAD Works in text-to-cad

The implicit CAD skill follows a strict separation between human-readable authoring interfaces and high-performance runtime libraries. The architecture divides responsibilities across four layers: skill definitions under `skills/`, shared runtimes under `packages/`, skill-specific wrappers, and a browser-based viewer.

### Authoring GLSL SDF Modules

Users define models by authoring ES modules that export a schema-conforming object. According to the schema defined in `skills/implicit-cad/scripts/lib/implicit-cad.mjs`, each module must contain GLSL code defining `float sdf(vec3 p)` and optionally `vec3 color(vec3 p, vec3 normal)`.

The helper library at `skills/implicit-cad/scripts/lib/implicit-cad.mjs` re-exports `IMPLICIT_CAD_SCHEMA` and provides utility functions—such as `vec3()`, `glsl()`, `unionRound()`, `sphere()`, and `boxCentered()`—that generate GLSL snippets programmatically. This allows developers to compose complex CSG operations in JavaScript while emitting optimized shader code.

### The ImplicitJS Runtime Evaluation

The heavy lifting occurs in the `packages/implicitjs/` runtime, which provides CPU and GPU evaluation of signed-distance functions. Key components include:

- **[`src/lib/implicitCad/sdfEvaluator.js`](https://github.com/earthtojake/text-to-cad/blob/main/src/lib/implicitCad/sdfEvaluator.js)** – Evaluates the signed-distance function against sampled points to determine surface boundaries.
- **[`src/lib/implicitCad/mesh.js`](https://github.com/earthtojake/text-to-cad/blob/main/src/lib/implicitCad/mesh.js)** – Samples the SDF within declared bounds using spatial hashing to generate indexed triangle meshes.
- **[`src/lib/implicitCad/render.js`](https://github.com/earthtojake/text-to-cad/blob/main/src/lib/implicitCad/render.js)** – Constructs the WebGL ray-march pipeline used for interactive preview.

This architecture ensures that the same mathematical definition drives both real-time visualization and final mesh generation, preventing geometry drift between preview and export.

### Raymarch Rendering Pipeline

The **raymarch rendering** system implemented in [`src/lib/implicitCad/render.js`](https://github.com/earthtojake/text-to-cad/blob/main/src/lib/implicitCad/render.js) casts rays from the camera into the scene, marching along each ray according to the SDF's distance estimates until hitting a surface or exceeding maximum steps. This technique renders the implicit surface directly without tessellation, enabling smooth curved geometry that remains crisp at any zoom level.

The rendering pipeline integrates with the shared `cadjs` package under `packages/cadjs/`, which abstracts WebGL context management and provides parsers for STEP, URDF, and SDF formats. The CAD Viewer—located in `viewer/` and exposed via `skills/cad-viewer/`—loads generated ES modules and executes the raymarch shader on the GPU.

### Export and Snapshot Generation

Once the model is validated, the runtime supports multiple export paths:

- **Mesh Export** – [`src/lib/implicitCad/export.js`](https://github.com/earthtojake/text-to-cad/blob/main/src/lib/implicitCad/export.js) converts the sampled mesh to GLB, STL, or 3MF using the marching cubes algorithm implemented in [`mesh.js`](https://github.com/earthtojake/text-to-cad/blob/main/mesh.js).
- **Visual Snapshots** – [`src/lib/implicitCad/snapshot.js`](https://github.com/earthtojake/text-to-cad/blob/main/src/lib/implicitCad/snapshot.js) provides a headless render pipeline for generating PNG/GIF images, utilizing the same entry point as [`src/common/implicitHeadlessRenderEntry.js`](https://github.com/earthtojake/text-to-cad/blob/main/src/common/implicitHeadlessRenderEntry.js) to guarantee visual parity between the Viewer and CI artifacts.

The skill exposes these capabilities through dedicated CLI scripts: `skills/implicit-cad/scripts/snapshot.mjs` for visual QA and `skills/implicit-cad/scripts/export.mjs` for mesh generation.

## Practical Example: Creating a Rounded Capsule

The following example demonstrates the authoring workflow using the helper DSL to generate a rounded capsule composition.

```javascript
// models/implicit-cad/rounded_capsule.implicit.js
import { createImplicitModel, sphere, boxCentered, unionRound } from '../../skills/implicit-cad/scripts/lib/implicit-cad.mjs';

export default createImplicitModel({
  name: "Rounded Capsule Block",
  glsl: unionRound([
    sphere('p', [0, 0, 0], 22),
    boxCentered('p', [34, 18, 18])
  ], 3).glsl,
});

```

Generate a visual snapshot for rapid iteration:

```bash
node skills/implicit-cad/scripts/snapshot.mjs \
  --input models/implicit-cad/rounded_capsule.implicit.js \
  --output /tmp/rounded_capsule.png

```

Export to GLB for downstream CAD workflows:

```bash
node skills/implicit-cad/scripts/export.mjs \
  --input models/implicit-cad/rounded_capsule.implicit.js \
  --format glb

```

## Key File Reference

Understanding the repository structure helps navigate the implicit CAD implementation:

- **[`skills/implicit-cad/SKILL.md`](https://github.com/earthtojake/text-to-cad/blob/main/skills/implicit-cad/SKILL.md)** – Skill manifest documenting the authoring format and CLI usage.
- **`skills/implicit-cad/scripts/lib/implicit-cad.mjs`** – DSL helpers for GLSL generation.
- **`skills/implicit-cad/scripts/packages/implicitjs/src/lib/implicitCad/`** – Core runtime containing [`sdfEvaluator.js`](https://github.com/earthtojake/text-to-cad/blob/main/sdfEvaluator.js), [`mesh.js`](https://github.com/earthtojake/text-to-cad/blob/main/mesh.js), [`render.js`](https://github.com/earthtojake/text-to-cad/blob/main/render.js), and [`export.js`](https://github.com/earthtojake/text-to-cad/blob/main/export.js).
- **`packages/cadjs/`** – Shared rendering and parsing utilities used across all CAD skills.
- **`skills/implicit-cad/scripts/snapshot.mjs`** – Headless rendering CLI for automated visual testing.

## Summary

- The **text-to-cad** repository implements **implicit CAD with GLSL signed-distance fields and raymarch rendering** through a modular skill architecture.
- Authoring occurs in JavaScript modules that generate GLSL shader code, validated against `IMPLICIT_CAD_SCHEMA` exported from `skills/implicit-cad/scripts/lib/implicit-cad.mjs`.
- The `implicitjs` runtime provides GPU-accelerated SDF evaluation, raymarch rendering, and mesh export to industry-standard formats.
- Visual fidelity is guaranteed across Viewer, snapshot, and export pipelines through shared render contexts in `packages/cadjs/`.

## Frequently Asked Questions

### How does raymarch rendering differ from polygonal rendering in text-to-cad?

**Raymarch rendering** evaluates the signed-distance field directly on the GPU by marching rays through the scene volume, producing mathematically precise surfaces without polygon tessellation. In contrast, the polygonal path samples the SDF on the CPU via [`sdfEvaluator.js`](https://github.com/earthtojake/text-to-cad/blob/main/sdfEvaluator.js) and [`mesh.js`](https://github.com/earthtojake/text-to-cad/blob/main/mesh.js) to generate indexed triangle meshes for export to GLB or STL formats.

### Which GLSL functions must I define when authoring an implicit CAD model?

You must define `float sdf(vec3 p)` returning the signed distance from point **p** to the surface (negative inside, positive outside). Optionally, define `vec3 color(vec3 p, vec3 normal)` to specify surface color. The `skills/implicit-cad/scripts/lib/implicit-cad.mjs` helper library generates these functions automatically when using high-level constructors like `sphere()` or `unionRound()`.

### Can I use the implicit CAD runtime outside the text-to-cad viewer?

Yes. The `implicitjs` package is framework-agnostic and exposes headless rendering via [`src/common/implicitHeadlessRenderEntry.js`](https://github.com/earthtojake/text-to-cad/blob/main/src/common/implicitHeadlessRenderEntry.js) and CLI scripts like `snapshot.mjs` and `export.mjs`. These tools function in Node.js environments without browser dependencies, enabling automated CI/CD pipelines for generative CAD workflows.

### What mesh formats does the implicit CAD skill support?

The export pipeline in [`src/lib/implicitCad/export.js`](https://github.com/earthtojake/text-to-cad/blob/main/src/lib/implicitCad/export.js) supports **GLB** (glTF binary), **STL** (stereolithography), and **3MF** (3D Manufacturing Format), ensuring compatibility with slicers, simulation tools, and traditional CAD packages.