The configurator
your customers finish.
DesignMint is a visual product configurator for brands selling physical goods. Real-time previews, a rules engine that prevents unbuildable orders, and print-ready output your production team can use unedited.
From rules to checkout
in three steps.
You bring the storefront and the production pipeline. DesignMint is everything in between.
Draw design areas on each product side in real millimeters. Set techniques, fonts, DPI and price rules. Publish once.
Your team pre-designs in the same studio; customers finish in the full canvas or a quick form.
Every order returns a layered SVG, print-ready PDF and preview — true to size, tagged for your shop floor.
Draw the rules. The studio obeys.
Backoffice is where you set a product up: upload each side, draw the design areas directly on the photo in real units, and attach the constraints. Whatever you publish is exactly what the Studio and the form enforce.
- Design areas per product, per side, calibrated in millimeters
- Allowed techniques, fonts, colors and minimum DPI per area
- Price rules by technique, coverage and quantity
- Locked layers and template guardrails customers can't break
Two ways to customize.
One rule set.
Power users get the full canvas. Quick shoppers get a form. Both obey the exact design areas and constraints you published in Backoffice.
The Studio
The full editor — Canva-familiar for customers, print-safe for you. Your team uses the same canvas in admin mode to pre-design products and publish them as templates.
The Form
A guided panel on the product page: pick a color, order by size, type a name and number, upload a logo. No canvas to learn — the design lands exactly where your rules place it.
Twenty tools. One
production-ready artwork.
Every piece of the studio feels familiar to anyone who has opened Figma — with the precision and constraints of a print production pipeline.
Groups, masks, locks, z-order — the whole design primitive. Author constraints, then let customers play.
Quick styles, custom font upload, curved and warped text effects, print-safe stroke handling.
Authorable per product and per side, with locked layers and brand guardrails.
PSD, AI, EPS, CDR, PDF, SVG, PNG. DPI-checked before checkout.
A bundled library, or bring your own SVG sets in your own categories.
Stitch-density previews, thread-count pricing, DST / EXP / PES export.
Every edit lands on the product photo instantly — real print area, real size.
Real-time WebGL — customers spin the product and check every side before they buy.
Base, decoration and totals update as customers design — by technique, area and quantity.
One artwork, synced across products — position and sizing follow each print area dynamically.
Several print areas and techniques on one product — front, back, sleeve — each priced and exported on its own.
Add, remove and reorder colourways and sides from inside the studio — and the design re-checks itself when the technique changes.
Opacity, stroke and shadow, image filters and effects, clip paths and brushes, group, lock and hide — every object, one panel.
Rulers, guides and snap-to-grid, full zoom and pan, and a complete undo / redo history.
Real dimensions as you design, in the unit you work in — mm, cm or inches — against the true print area.
Low-DPI and out-of-bleed warnings as they happen, each with a fix — shrink it, vectorize it, nudge it back.
One logo, many versions — a v2 colourway syncs everywhere v1 was placed, across every product in the brand.
PNG, SVG and PDF per print area, CMYK-ready and true to size — straight to the press queue.
Undo, redo, duplicate, group, nudge, zoom — the shortcuts designers already know.
Generate images and product mockups inside the studio, and create AI-made templates your customers start from.
Anything printable.
Anything personal.
Teams use DesignMint for everything from team jerseys to wedding invites. Open any of these in the live studio — no sign-up needed.
Every technique.
True to size.
Design areas are calibrated in real units. A 280 × 350 mm chest print exports at exactly 280 × 350 mm — per technique, per side, no scaling surprises at the press.
| Technique | Best for | Surfaces | Output |
|---|---|---|---|
| DTG | Full-color prints on cotton | Tees, hoodies, totes | PNG · 300 DPI |
| DTF | Transfers for mixed fabrics, low minimums | Poly blends, caps | PNG · 300 DPI |
| Dye sublimation | Full-bleed, all-over color | Polyester, mugs, panels | Wrap artwork |
| Laser engraving | Clean vector marks | Metal, wood, leather, glass | SVG paths |
| Embroidery | Stitched, premium finish | Caps, polos, jackets | DST · EXP · PES |
| UV · screen · vinyl | Bring your own technique | Anything declared in Backoffice | Custom rules |
Cleanup and creation,
built into the canvas.
One tap in the context menu. Customer artwork gets production-grade without ever leaving the editor. Powered by DesignMint Prepress.
Raster to clean vector — the difference between a blurry engraving and a crisp one.
Low-resolution uploads pass DPI checks instead of failing at checkout.
Server-side, precise cutouts on customer photos and logos.
Customers describe artwork; the studio generates it inside your print constraints.
One component.
Fully yours to theme.
The Studio is the default export of @intuio/designmint-studio — no providers or wrappers. It ships no CSS of its own; your Tailwind build generates its classes. Browser-only: in SSR frameworks load it client-side with ssr: false.
// ProductStudio.jsx // 1. install (private @intuio scope — token in .npmrc) $ npm i @intuio/designmint-studio // 2. mount it import DesignMintStudio from "@intuio/designmint-studio" export function ProductStudio({ metadata, products, customer }) { return ( <div className="h-screen min-h-0"> <DesignMintStudio metadata={metadata} // from the Back Office save() products={products} // your priced catalog productCanvasData={{}} backendUrl={BACKEND_URL} publishableKey={PUBLISHABLE_API_KEY} customerId={customer?.id ?? null} currencyCode="usd" onAddToCart={async (items) => { /* create the cart lines */ }} /> </div> ) }
Fits your stack. Reads your files.
First-party adapters for the platforms you run — and native import for the files your customers already have, from Photoshop to CorelDRAW.
Every feature above.
One licence.
License the studio, rules engine and export for your own stack — one price, unlimited editor seats. Prefer it hosted? Commerce runs the same studio on a hosted storefront.
Answers, up front.
Is this a hosted service or self-hosted?+
Both. Most teams use the managed service — the studio renders client-side and order artifacts live in a region you pick. Regulated or high-volume teams can self-host via Docker with an SDK license.
Will it match my existing storefront design?+
Yes. Every surface is a CSS variable and every piece of chrome is a slot. Pass your tokens, ship your own toolbar, override the cart button — whatever you need.
Which printing techniques do you support?+
DTG, DTF, dye sublimation, laser engraving and embroidery out of the box — each with true-to-size export and its own rules. Any other technique can be declared with custom constraints and pricing.
Can I use my own fonts?+
Yes. Upload a WOFF2 or TTF and it's available in the studio and in the production pipeline. Licensing remains yours.
How long does integration take?+
A working proof of concept with one product is a matter of hours. Full production rollout with your print partner typically takes a few days to two weeks.
Embedded the studio in our Next.js storefront in an afternoon. Exports drop straight into our DTF queue, true to size, every time.
See it on your products.
Drop DesignMint in, wire three callbacks, and launch your configurator this week.