The Product Mockup Generator is 100% client‑side. When you drop or paste a file it is turned into a local object‑URL and decoded into an <img> in the page; a pure engine (productMockupEngine.ts) draws the chosen product from vector paths and composites your design into its print area on an offscreen <canvas>. The exported PNG is generated in memory and saved straight to your downloads. Nothing is fetched, uploaded, logged or stored on a server, there are no external stock photos, and the tool works offline once cached. The only optional network use is consent‑gated ads.

You can place a design on ten locally‑drawn products: a crew t‑shirt, a hoodie, an 11oz mug (with a cylinder wrap), a hard phone case, a canvas tote bag, a cap, a framed poster with a white mat, a laptop lid, a die‑cut sticker and a stacked business card. Each has its own defined print area. For the design, any image the browser can decode works — PNG, SVG, JPG, WebP or GIF — and a transparent PNG or an SVG gives the cleanest result because the product colour shows through the empty areas. Switching products keeps the same design and re‑fits it to the new print area automatically.

A colour control recolours whatever matters for each product — the shirt, the mug body, the case, the frame, the card stock, and so on — with a hex field and quick swatches. To make a print sit correctly on a coloured product, choose a blend mode: Normal is opaque; Multiply drops the white parts of your artwork so a black‑on‑white logo works on a dark shirt; Screen drops the black parts for a white logo on a light product; Overlay tints the design toward the product colour. A soft multiply shading pass (and a cylinder warp on the mug) is applied so the print looks like it sits on the surface rather than floating on top.

To keep your artwork completely private and make the tool work offline, the products are drawn from vector shapes rather than photographed. So there are no real fabric wrinkles, no photographic lighting and no true 3‑D draping beyond the mug’s simple cylinder projection and a soft shading pass; print areas are fixed rectangles that contain the design. This is ideal for a quick product‑page thumbnail, a social post or a client concept. For a photorealistic hero shot you would still want a real photo template or a physical sample — the deliberate trade is total privacy and instant, offline results in exchange for photo realism.