Coffee Stencil Generator — make your own cocoa stencil from any SVG, in your browser

A single HTML file that turns any SVG — or something you draw yourself — into a print-ready coffee stencil STL. It warns you when parts of your design would fall out of the stencil after printing, and fixes it for you. No install, no account, no upload: everything runs offline in your browser.

Other coffee stencil generators want your artwork in one very specific format, and they stretch whatever you give them into a square. This one doesn't. Drop in an SVG, adjust it visually, and download an STL that is guaranteed to print in one piece.

Everything runs locally in your browser. Open the HTML file — that's it. No install, no sign-up, nothing is uploaded anywhere. Works offline. German and English interface.

Your SVG stays your SVG. Aspect ratio is preserved and the motif is centred on the real bounding box of your artwork. The parser handles path, rect, circle, ellipse, line, polyline, polygon, g, use, nested transforms, Bézier and arc segments, and both evenodd and nonzero fill rules. If your file has a white background rectangle, it gets detected and switched off automatically — and you can toggle every colour in the file individually.

It tells you before you waste filament. The classic failure with stencils is a shape like the middle of an "O": after printing, that island simply drops out. This tool finds every disconnected area, marks it red in the preview, and gives you two one-click fixes:

• Add bridges automatically — connects each island to the stencil along the shortest path, with an adjustable bridge width. The detail survives.

• Cut away loose areas — deletes them instead, so they become part of the opening.

It also warns about openings narrower than 0.7 mm (cocoa won't fall through), material webs under 0.8 mm (they snap), motif parts sticking out past the circle, and — importantly — whether the disc actually rests on your cup rim instead of dropping into your coffee.

Nothing has to be right on the first try. Every slider has a number field next to it, so you can type exact millimetres. Drawn shapes stay editable: select one, drag it, pull the handles to resize, rotate it, or type its exact centre, width and height. The imported SVG works the same way — drag it straight in the preview, scale it from the corners, rotate it with the top handle.

How to use it

1. Open  coffee-stencil-generator.html 

2. Drag an SVG onto the drop zone — or switch to Draw and make something yourself.

3. Set your dimensions: motif diameter, rim, thickness, handle, and your cup's inner diameter (it uses this to check the stencil will actually sit on the rim).

4. Read the check panel. If it reports loose areas, click Add bridges automatically or tick Cut away loose areas.

5. Download STL. Print flat, no supports.

Drawing tools

Select · Pen · Line · Rectangle · Circle/Oval · Triangle · Polygon · Star · Heart · Drop · Flower · Arc · Cross

Each shape can be filled (whole shape cut out) or outline (edge only, in 2 / 3.5 / 5 mm line width), and each can add or erase — so you can erase precisely with a rectangle instead of scrubbing freehand. Polygons, stars and flowers take 3–12 points. Hold Shift while dragging for a perfect circle or square, or 15° line snapping.

Feature list

• SVG import with proper aspect ratio — no more stretched motifs

• Automatic colour filtering (background rectangles detected and excluded)

• 13 drawing tools, filled or outlined, add or erase

• Full editing after the fact: move, resize, rotate, duplicate, reorder, delete

• Numeric input on every control — type exact millimetres

• Disconnected-area detection with two automatic fixes

• Warnings for fine openings, thin webs, clipped motifs and cup fit

• Live coffee preview — see the cocoa on the foam before you print

• Motif diameter 20–160 mm, cup diameter 40–200 mm (espresso to soup mug)

• Optional handle with hanging hole

• Invert mode (motif stays, background is cut out)

• Exports STL, plus SVG (for laser cutters) and OpenSCAD

• Save/load your work as a project file

• German and English interface

• Undo/redo throughout

About the STL

The mesh is built by rasterising the design, extracting contours with marching squares, simplifying them, and triangulating with ear clipping. Side walls are generated from the boundary edges of the finished triangulation, which is what guarantees a closed solid.

Every exported STL has been verified to be watertight and manifold — zero open edges, with the enclosed volume matching the design area × thickness to within 0.05 %. Slicers take it without repair. Typical file size is 100–150 KB.