View

Fabric.js Garment Editor

Mockup

Generator

iPhone 16 Case

Real-time Mockups — by Studio Innate™

Fabric.js Garment Editor

You may also like...

PRO

Women’s Oversized T-Shirt (Front)

Start Editing →
PRO

Baggy Sweatpants (Back)

Start Editing →
PRO

Girls Boxy T-Shirt

Start Editing →
PRO

Modelled Crewneck (Front)

Start Editing →

Getting Started

How it works...

We’ve designed this tool to make customising garments as easy and intuitive as possible. With just a few clicks, you can upload your design, adjust colours, and export a high-resolution mock-up—all from within your browser on any device and without the need for third-party software.

1. Upload Your Design

Click the ‘Add Design’ button to upload your artwork (supports JPG, PNG, SVG).

Your design will automatically appear on the garment mock-up.

Adjust the position and size of your design using the mouse.

2. Change Garment Colour

Click on the ‘Colour‘ button to open the colour picker.

Select a new colour for the garment. The preview will update in real-time.

3. Delete a Design

To delete a design, click on it and then press the trash icon that appears.

Only the selected design will be removed.

4. Export Your Design

Once you’re happy with your mock-up, click the ‘HD Export’ button.

Your design will download as a high-resolution PNG file.

Start Designing

FAQ

Here are answers to some common questions to help you get the most out of our garment editor. Whether you’re curious about how your artwork is handled or want to know more about the available features, this section covers it all. 

No, your artwork is processed entirely within your browser. It is never uploaded to our server, meaning we do not store or access any of your designs.

Yes, you can upload multiple designs at once, and they will be added to the canvas. You can adjust or remove each design individually.

Yes, after uploading your design, click on it and use your mouse to resize or reposition it as needed.

To reset the canvas, simply refresh the page. Please note that this will delete all current designs, so be sure to export your work before resetting.

You can upload JPG, PNG, and SVG files.

Currently, your work is not saved automatically. Make sure to export your design if you need to save it, as closing the browser will clear your progress.

Our mockup tool is designed with simplicity and accessibility in mind, providing a streamlined interface that focuses on delivering high-quality mockups without unnecessary complexity. While we don’t currently offer freehand drawing features, we believe it’s best to use specialised tools to maximise the quality of your design work. Platforms like Procreate, renowned for their freehand drawing capabilities, offer an exceptional range of features to elevate your creative process. For those who prefer a browser-based option, Sketchpad is a powerful, feature-rich alternative that’s free to use. Once you’ve crafted your freehand designs, we recommend exporting your artwork as PNG files, which can then be uploaded to our mockup tool for final touches and editing.

Your subscription to the Mockup Generator grants you full access to all mockups in the online editor. As a member, you also get at least 20% off everything else on the store—no need to build a custom bundle to save. Other digital products, like fonts, vector packs, motion packs, 3D Blender models, and texture packs, are available separately for direct download, ready for you to explore and customise. Our resources are designed to elevate your work, so feel free to browse our collection and find fresh inspiration for your next project!

Start Designing

"Easily, the best-designed mockups for apparel anywhere."

Chris Do,
The Futur / Blind

Trusted & Used By
Design resources for captivating presentations
Stand out with our mockups and design resources
Adobe
Mockups that bring your ideas to life
Transform your designs with our resources
Mockups designed to impress
Access a diverse range of design resources
Professional tools for visual excellence
jagermeister
spotify
WMG
merch-traffic
linktree
Puma

More Design Resources

Create design harmony with our curated selection of design resources.
Mockups
Vectors
Textures
Motion
Fonts
Freebies
Discounts, Freebies & Perks

Sign up for free resources, discounts, and perks.

🔒 UNLOCK
Company
Earn with us
Connect
Payments Methods

Studio Innate™  |  Terms & Conditions
ⓒ 2025 All rights reserved | Company No. 10103534
Essentials Bundle

15% OFF

When you bundle up with 3-5 items

Discount automatically applied at the checkout. Discounts can’t be combined with other discounts.