A six-tab creative workbench served from a single Node file — real build telemetry, a hand-built generative gallery, a code peek, palette tools, type specimens and motion labs. No frameworks, no fluff.
Live status of the rendering pipeline, seeded with the last run.
Hand-built CSS compositions — each a different derived direction.
The render function powering every artifact above.
// derive a palette from the subject's world
function forge(spec) {
const hue = deriveHue(spec.subject);
const scale = [4,8,12,16,24,32,48,64,96];
return {
canvas: compose({
dominant: hue,
accent: shift(hue, 42),
grid: spec.grid ?? 12,
rhythm: scale
}),
motion: 'cubic-bezier(0.4,0,0.2,1)'
};
}
Tap a scheme to apply it across the studio.
A display face paired with a refined body, on a modular scale.
Forge ideas into living interfaces
A workbench for considered making
Type carries the voice of an interface before a single word is read. Pair a characterful display with a calm, legible body and let the scale do the rhythm — overline to hero, never more than two families.
Press play to preview each easing curve at 220ms base.