MATERIAL STUDIO / 0.1.0

Give your ideas
a surface.

From the first brushstroke to the final texture set. A browser-native workspace for painting, layering, and exploring materials in 3D.

Open ChromaForge ↗Explore the workspace ↓
No install to editOriginal, open sourceLocal-first projects
NOMAD / MATERIAL STUDY
Try a surface
Preparing renderer…Drag to orbit
PAINT IN 3D & 2D✦EDITABLE LAYER STACKS✦MULTI-CHANNEL MATERIALS✦REAL-TIME COLLABORATION*
01 / YOUR WORKSPACE

A familiar canvas.
A different foundation.

Stay close to your material. Split views, compact controls, and resizable panels keep the mesh, UVs, and layers in one place.

ChromaForge studio showing an orange survey camera, UV view, editable layers and material shelfEnter the workspace ↗
01

Paint with intention.

Pressure-sensitive strokes, eight brush tips, channel selection, masks, image decals, and editable fill materials. Work directly on the mesh or in UV space.

02

Build the surface.

Layer color, roughness, metallic, height, emissive, and opacity. Explore original procedural materials, then export PNG maps in one ZIP.

03

Make room for others.

Share an explicit project copy through the included server. Invite editors or viewers, see their cursors, and keep notes alongside your work.

* Multi-user collaboration requires the included Node.js / SQLite service. A static site runs the editor locally; it does not host a collaboration database.

02 / NOT JUST AN APP

A studio built
from building blocks.

Use the whole workspace, or take the pieces. Six self-contained ES module packages separate document logic, geometry, texture authoring, rendering, controls, and collaboration.

Open the renderer example ↗
coregeometryrendererpaintcontrolscollab
● ● ● your-next-tool.js
import { MaterialRenderer }
  from './libraries/renderer.js';
import { createModel }
  from './libraries/geometry.js';

const viewport = new MaterialRenderer(canvas);
await viewport.initialize();
viewport.setMesh(createModel('sphere'));

// Supply composited material maps.
viewport.upload(0, textureOutput, 1);
viewport.draw();
PLAIN JAVASCRIPT NO FRAMEWORK REQUIRED
03 / START MAKING

Local by default.
Ready to make your own.

Run the complete app

Use Node.js 22.16 or newer. The application has no runtime npm dependencies.

npm start
# Open http://localhost:8787

Use the server for local autosave and authenticated shared rooms. Keep its data/ directory for persistent accounts and projects.

Build and distribute

Create the standalone HTML, static website, and individual library modules.

npm test
npm run build
npm run pack:libraries

Serve dist/site/ over HTTPS. For collaboration, deploy the complete Node service rather than only the static files.

A working first release, not a parity claim.

ChromaForge is an independent implementation, not an Adobe product. Native SPP/SBSAR, virtual UDIM streaming, high-to-low cage baking, particle painting, production color management, and full enterprise administration are not included. WebGPU is preferred where available, with WebGL2 and a reduced software compatibility renderer as fallbacks.

THE NEXT SURFACE IS YOURS.

Start with a stroke.

Launch ChromaForge ↗