image

  • soonImage enhancerEnhance detail and image quality
  • soonBackground removerIsolate subjects from backgrounds
  • soonMockup generatorPresent designs in realistic scenes

effects

design tools

  • soonTypography generatorExplore expressive type layouts
  • soonPalette generatorFind colors that work together
  • soonGradient generatorCreate gradients for any project

rubbing study

pro

Get the prompt, project and Figma file with monthly ($29 a month) or yearly ($249 a year). Plus tax where it applies.

An interactive WebGL study of a pencil rubbing. A blank sheet of paper lies tilted on a dark, softly lit desk, over a hidden metal plate. Press and drag and the lead, laid flat, leaves parallel graphite striations along your stroke, lighter at the lead's edges and when you move fast. The graphite catches fully on whatever is raised underneath and only grazes the paper's tooth and fibres elsewhere, so the plate comes up out of the grain: a frame with corner dots, a guilloché rosette of 72 ellipses ringed by "ONE-TIME ACCESS · PRESSED, NOT PRINTED", "ACCESS CODE", a six-digit code, a rule, "VALID 10 MIN · No" with a serial, and a row of dots. A faint emboss of the plate shows through the blank paper, and rubbed edges pick up a graphite sheen. Double-click, double-tap or press C to erase: the graphite fades, and as it goes a new random code is placed underneath, showing faintly through what's left. A ring-and-dot cursor turns dark over the paper and its ring shrinks away while you rub. The plate is drawn to a canvas and softened into a height map, the strokes are painted into a graphite buffer, and one fragment shader makes the paper. Touch rubs too, and on phones the sheet fills more of the screen. ?seed= fixes the code and the strokes, ?z= scales the sheet.

what you get

prompt
Paste it into Claude, Codex, Kimi or Cursor to rebuild this template. Tested: we rebuild every template from its prompt before it goes live.
project
The Vite + React source code as a .zip, ready to run.
figma file
The editable design as a .fig file to import into Figma.

what's inside

  • webgl shader
  • drag to reveal
  • pencil rubbing
  • access code
  • custom cursor
  • touch gestures

stack

  • react
  • vite
  • typescript
  • webgl
  • canvas

fonts

IBM Plex Mono

Free fonts, linked in the prompt.

colors

  • #0C0B09
  • #16140F
  • #2A2722
  • #F3F1EC
  • #343439

license

With monthly or yearly: personal and commercial work, client projects included. Don't resell or share the template, prompt or files.

read the license