Skill

Review

Audit score 70

implicit-cad

earthtojake/text-to-cad

Create browser-native implicit CAD models using GLSL signed-distance fields and shader primitives.

What is implicit-cad?

Build `.implicit.js` and `.implicit.mjs` files that render directly in CAD Viewer using GLSL-based signed-distance functions, smooth booleans, TPMS fields, and raymarch rendering. Use this for procedural geometry that benefits from shader-based definition rather than traditional CAD workflows.

Write ES modules exporting implicit CAD schemas with GLSL SDF and color functions
Define parametric models with number, boolean, enum, color, and button controls that map to GLSL uniforms
Create animations that update parameters over time for interactive exploration
Use built-in GLSL helpers for primitives (sphere, box, torus, cylinder, cone, capsule), booleans (union, intersect, difference with sharp/round/chamfer/exp blends), modifiers (shell, repeat, remap), and TPMS lattice fields (gyroid, Schwarz, diamond, etc.)
Snapshot models to PNG or GIF for visual verification across multiple camera angles
Export to GLB, STL, or 3MF mesh formats for downstream use

How to install implicit-cad

npx skills add https://github.com/earthtojake/text-to-cad --skill implicit-cad

Prerequisites

Node.js environment with access to skill scripts (snapshot.mjs, export.mjs)
Basic understanding of signed-distance functions and GLSL
CAD Viewer skill installed for viewing and exporting results

Claude Code

Cursor

Windsurf

Cline

How to use implicit-cad

1.Write a natural-language brief describing dimensions, coordinate system, color intent, and visual checks
2.Create or edit a `.implicit.js` or `.implicit.mjs` ES module exporting an implicit.js/0.1.0 object with schema, name, and glsl properties
3.Define the SDF function in GLSL using built-in implicit_* helpers (implicit_sphere, implicit_box_centered, implicit_union_round, etc.) or custom distance logic
4.Add optional params object to expose number, boolean, enum, color, or button controls; param names become GLSL uniforms automatically
5.Add optional color(vec3 p, vec3 normal) function for procedural material variation
6.Add optional animations object with duration and update callbacks to drive parameter changes
7.Add optional bounds and render objects to control framing and raymarch quality
8.Run snapshot.mjs to verify geometry, color, params, and animation visually before export

Use cases

Good for

Design parametric lattice structures and TPMS-based infill for 3D printing
Create procedurally-colored organic shapes with smooth boolean blends
Build animated models for visualization and parameter exploration in the browser
Generate complex periodic geometries (honeycombs, grids) without manual mesh creation
Prototype implicit geometry before exporting to conventional CAD formats

Who it's for

3D printing engineers working with lattice and infill structures
Procedural geometry developers comfortable with GLSL and shader programming
Product designers exploring parametric and animated models
Researchers working with TPMS and periodic structures

implicit-cad FAQ

When should I use implicit CAD instead of conventional STEP-based workflows?

Use implicit CAD when the user explicitly requests it, or when the model benefits from procedural definition, parametric control, TPMS lattices, or shader-based color. Always prefer conventional CAD workflows unless implicit geometry is the right fit.

How do I define custom GLSL primitives or booleans?

Use the built-in implicit_* helpers from scripts/lib/implicit-cad.mjs (e.g., implicit_sphere, implicit_union_round). For custom logic, write GLSL directly in the sdf() function. Do not copy bundled helper files; emit standalone GLSL into the final module if needed.

How do I make parameters interactive in the model?

Add a params object with type (number, boolean, enum, color, string, button), label, min/max, default, and unit. Parameter names automatically become GLSL uniforms; reference them directly in your GLSL code.

What should I check in a snapshot before exporting?

Verify centered framing with no clipping, expected silhouette and topology, visible parameter differences, GLSL-defined colors, no unexpected holes or gaps, and smooth edges. Use multiple camera angles (iso, front, top, right) for complex models.

How do I export to a mesh format like STL or GLB?

Run `node scripts/export.mjs --input <model.implicit.js> --format glb` (or stl, 3mf). Then hand off the file path to $cad-viewer to open it and generate a live viewer link.

Full instructions (SKILL.md)

Source of truth, from earthtojake/text-to-cad.

name: implicit-cad description: Create, edit, render, and snapshot browser-native implicit CAD `.implicit.js` and `.implicit.mjs` files using GLSL signed-distance fields, shader primitives, smooth booleans, TPMS fields, and direct CAD Viewer raymarch rendering. Experimental.

Implicit CAD

Use this skill for implicit CAD models that should run directly in CAD Viewer as browser JS modules. The primary artifact is a .implicit.js or .implicit.mjs.

This skill is experimental. ALWAYS prefer conventional STEP-first CAD workflows unless the user explicitly asks for an implicit model.

File Format

An implicit CAD file is an ES module exporting an implicit.js/0.1.0 object. The schema source of truth lives in the bundled package at scripts/packages/implicitjs/src/lib/implicitCad/schema.js; scripts/lib/implicit-cad.mjs re-exports it as SCHEMA for helper-authored modules.

export default {
  schema: "implicit.js/0.1.0",
  name: "rounded capsule block",
  glsl: `
float sdf(vec3 p) {
  float sphere = implicit_sphere(p, vec3(0.0), 22.0);
  float block = implicit_box_centered(p, vec3(34.0, 18.0, 18.0), vec3(0.0));
  return implicit_union_round(sphere, block, 3.0);
}

vec3 color(vec3 p, vec3 normal) {
  return mix(vec3(0.20, 0.55, 0.95), vec3(0.95, 0.45, 0.20), smoothstep(-15.0, 20.0, p.z));
}
`,
};

Models may also declare params and animations. Parameter definitions use the implicitjs control schema: number, boolean, enum/select, color, string, and button. Number, boolean, color, and button params automatically become GLSL uniforms with the same name; do not add a separate uniforms object. bounds is optional and is estimated from the SDF when omitted; add explicit bounds only when the auto estimate is too broad, too slow, or misses an unusual field. bounds and render may be JavaScript functions that receive { ...params, params, animation, animationState, elapsedSec, progress, t }.

Built-in GLSL helpers use the implicit_* namespace, for example implicit_sphere, implicit_box_centered, and implicit_union_round.

export default {
  schema: "implicit.js/0.1.0",
  name: "breathing orb",
  params: {
    radius: {
      type: "number",
      label: "Radius",
      min: 12,
      max: 34,
      default: 22,
      unit: "mm",
    },
  },
  animations: {
    breathe: {
      label: "Breathe",
      duration: 3,
      update({ progress, set }) {
        set("radius", 18 + Math.sin(progress * Math.PI) * 10);
      },
    },
  },
  render: { steps: 224, epsilon: 0.004 },
  glsl: `
float sdf(vec3 p) {
  return length(p) - radius;
}

vec3 color(vec3 p, vec3 normal) {
  return mix(vec3(0.10, 0.58, 0.95), vec3(1.0, 0.34, 0.12), smoothstep(-18.0, 18.0, p.z));
}
`,
};

Do not copy bundled helper files out of this skill. If helper functions are useful, use scripts/lib/implicit-cad.mjs during authoring or emit standalone GLSL into the final .implicit.js/.implicit.mjs module.

Authoring Workflow

Write a natural-language modeling brief with dimensions, coordinate assumptions, procedural color intent, and visual checks.
Create or edit the user-specified .implicit.js/.implicit.mjs module.
Use scripts/lib/implicit-cad.mjs helpers for primitives and field composition when useful:
- primitives: sphere, circle, boxCentered, plane, lineSegment, torus, axis, cylinder, cylinderCapped, capsule, cone, coneCapped, coneCapsule
- booleans/blends: unionSharp, intersectSharp, unionRound, intersectRound, unionChamfer, intersectChamfer, unionExp, intersectExp, unionLpNorm, intersectLpNorm, unionRvachev, intersectRvachev, difference
- modifiers/lattices: shell, rotateAxis, repeatCentered, remapCylindrical, cubicGrid, squareHoneycomb, squareHoneycombReinforced, squareDiagonalHoneycomb, octetHoneycomb, hexagonalHoneycomb, triangularHoneycomb
- TPMS fields: tpmsGyroid, tpmsSchwarz, tpmsDiamond, tpmsLidinoid, tpmsNeovius, tpmsSplitP, tpmsIwp
- shader wrappers: distanceFunction emits float sdf(vec3 p), colorFunction emits vec3 color(vec3 p, vec3 normal)
Add optional params and animations for dimensions, toggles, palettes, mode switches, and animated exploration. Use param names directly in GLSL; the runtime declares matching uniforms.
Add optional procedural color with vec3 color(vec3 p, vec3 normal) when the model benefits from local material variation. Keep color values in 0..1 RGB.
Rely on automatic SDF bounds first. Add explicit bounds when an animated, periodic, translated, or very thin model needs tighter or more reliable framing/export sampling.
Run the lightweight visual verification flow below after visible geometry, color, params, animation, bounds, render, or export-affecting changes.
Run node scripts/export.mjs --input <model.implicit.js> --format glb when a mesh artifact is needed for downstream viewers, slicers, or file handoff.

Visual Verification

Use this skill's snapshot tool as a fast visual check, not as a substitute for deterministic import/export validation. Keep the packet small and purposeful.

For simple static edits, one image is enough:

node scripts/snapshot.mjs --input models/implicit-cad/<model>.implicit.js --output /tmp/implicit-review/<model>.png

For topology, periodicity, thin features, Boolean blends, object identity, color, or suspected framing issues, render a small packet in one CLI call so the browser, module, and runtime model are reused:

node scripts/snapshot.mjs --job - <<'JSON'
{
  "input": "models/implicit-cad/<model>.implicit.js",
  "mode": "view",
  "render": { "sizeProfile": "simple", "frameMargin": 1.55 },
  "graphics": { "modelColors": true, "detail": 1.2, "shadows": true, "ambientOcclusion": true },
  "outputs": [
    { "path": "/tmp/implicit-review/<model>-iso.png", "camera": "iso" },
    { "path": "/tmp/implicit-review/<model>-front.png", "camera": "front" },
    { "path": "/tmp/implicit-review/<model>-top.png", "camera": "top" },
    { "path": "/tmp/implicit-review/<model>-right.png", "camera": "right" }
  ]
}
JSON

Add implicitParameters at the job level for one parameter state, or on individual outputs when the point of the review is comparing parameter variants. Use render.frameMargin around 1.5 when a model is close to the edge; if a snapshot still appears clipped, first check whether the source bounds is cutting the raymarch itself.

For animations, create a short GIF only when motion is part of the request:

node scripts/snapshot.mjs --job - <<'JSON'
{
  "input": "models/implicit-cad/<model>.implicit.js",
  "mode": "animate",
  "outputs": [{ "path": "/tmp/implicit-review/<model>-animation.gif" }],
  "implicitAnimation": { "activeId": "<animation-id>", "durationSeconds": 3, "fps": 12 }
}
JSON

Review the resulting PNG/GIF for centered framing, no top/bottom/side clipping, expected silhouette and topology, visible parameter differences, GLSL-defined colors, no unexpected holes/gaps, and smooth enough edges for the requested graphics settings. If the snapshot reveals a mismatch, fix the implicit source or bounds and rerun only the relevant packet.

Handoff

After completing implicit CAD work that creates or modifies .implicit.js, .implicit.mjs, .glb, .stl, or .3mf artifacts, you must ALWAYS hand the explicit file path(s) to $cad-viewer when that skill is installed. $cad-viewer must start CAD Viewer if it is not already running and return link(s) to the relevant created or updated file(s); include those live viewer link(s) in the final response. If $cad-viewer is unavailable or startup fails, report that instead of silently omitting the handoff.

When verification snapshots are generated, also include the saved PNG/GIF snapshot(s) in the final response. If no snapshot applies, or if snapshot generation fails, say why and report the deterministic validation that still ran.

Snapshot Tool

From this skill directory:

node scripts/snapshot.mjs --input <model.implicit.js> --output <snapshot.png>
node scripts/snapshot.mjs --input <model.implicit.js> --output <orbit.gif> --mode orbit
node scripts/snapshot.mjs --job <render-job.json>
node scripts/snapshot.mjs --job - --json
node scripts/snapshot.mjs --help

Use node scripts/snapshot.mjs --help for the complete current command interface. The tool appends a UTC timestamp before the output extension. JSON jobs may be a single job, one job with multiple outputs, a raw array of jobs, or { "jobs": [...] }; prefer a multi-output job for review packets because it avoids rebuilding the same artifact for each camera.

Export Tool

From this skill directory:

node scripts/export.mjs --input <model.implicit.js> --format glb
node scripts/export.mjs --input <model.implicit.js> --output <mesh.stl> --resolution <resolution>
node scripts/export.mjs --input <model.implicit.js> --format 3mf --params '<parameter-json>' --json
node scripts/export.mjs --help

Supported export formats are glb, stl, and 3mf. The exporter samples the implicit SDF inside the declared bounds and extracts a triangle mesh. If --output is omitted, the mesh is written next to the source file using the same stem, such as <model>.glb for <model>.implicit.js. Use node scripts/export.mjs --help for the complete current command interface.