Online Tool Store
· 5 min read
Preview a Design on a T-Shirt Before Printing
Heshan Fernando
Co-founder & COO
The artwork looks great at 100% zoom on a white canvas. Then thirty shirts arrive and the logo sits two inches higher than you pictured, the fine linework has vanished into the fabric texture, and the color that read as deep navy on screen has come out closer to black on a heather grey shirt.
Every one of those problems is visible in a mockup and invisible in a design file. Previewing on a garment isn’t a nice-to-have step; it’s the step where you catch the mistakes that cost money.
What previewing on a garment actually shows you
Three things, none of which your design canvas can tell you.
Scale relative to the body. A design is not “10 inches wide” in any meaningful sense until you see it against a chest. The same artwork reads as bold on a small shirt and modest on an XL, which is why print files are usually specified per size range.
Placement. Standard front placements sit lower than most people expect — typically a few inches below the collar, not right under it. Seeing it on a shirt shape immediately shows whether your artwork will disappear under a chin or float too low.
Color against fabric. Ink on a colored garment behaves differently from pixels on white. Light inks on dark shirts need an underbase to stay opaque, and any design relying on the shirt color showing through needs to be checked against the actual garment color.
Why people get stuck here
- Designing on white and printing on black. Anything with white or near-white elements can vanish entirely, and thin dark lines on a dark shirt disappear.
- Fine detail that fabric can’t hold. Hairline strokes and small text that look crisp on screen fill in or break up on knit fabric.
- Wrong resolution. Print typically wants around 300 DPI at final size. A web-resolution logo scaled up looks fine on screen and soft on cotton.
- Ignoring size variants. One print size across XS to 3XL means the design is either too big on the small shirts or too small on the large ones.
- Trusting the supplier’s swatch photo. Garment colors photograph inconsistently, and “heather grey” varies considerably between suppliers.
What a good preview does
Shows the design in place, not floating
You need to see the artwork positioned on a shirt shape, at the size and location it’ll actually print, so the judgement you’re making is the real one.
Lets you change the garment color
Most print mistakes are contrast mistakes. Flipping the mockup between white, black, and a mid-tone catches nearly all of them in about ten seconds.
Runs before you commit money
A preview is only useful if it happens before the order. That means it needs to be fast enough to do in the middle of a design session, not a separate proofing round that takes two days.
| Check | What Goes Wrong | How To Catch It |
|---|---|---|
| Contrast | Light art on light fabric disappears | Preview on every garment color you’ll sell |
| Scale | Design too small on large sizes | View at more than one shirt size |
| Detail | Thin lines break up in print | Zoom to actual print size, not screen size |
| Placement | Sits too high under the collar | Compare against a standard placement guide |
Common mistakes to avoid
- Only previewing on white. White is the most forgiving garment and the least informative preview.
- Judging color on an uncalibrated screen. Screens run warm or cool; for anything where color accuracy matters, get a physical proof.
- Using RGB values for print without conversion. Screen colors don’t all exist in ink, and saturated blues and greens are the usual casualties.
- Forgetting the back and sleeve. If the design includes them, preview them too — sleeve prints have much tighter constraints.
- Skipping the sample print. For a run of any size, one physical sample is cheaper than reprinting thirty shirts.
How to do it with T-Shirt Design Previewer
Online Tool Store’s T-Shirt Design Previewer visualises prints on shirt mockups in your browser — your artwork is never uploaded to a server, which matters if the design isn’t public yet.
- Open the tool and load your artwork, ideally at print resolution rather than a web export.
- Position it at the placement you’re specifying to the printer, not wherever it looks nicest.
- Switch the garment color through every option you plan to sell, watching for elements that vanish.
- Zoom in to check the finest detail in the design — that’s where print reproduction fails first.
- Take a screenshot of each variant to send to whoever’s approving the run.
- Order one physical sample before the full print if the run is worth more than the sample costs.
The Background Remover and the Transparent PNG Maker are useful for prepping artwork, and the Poster Mockup Tool covers the print-goods side.
Frequently asked questions
What resolution should my artwork be?
Around 300 DPI at the final printed size is the common standard for apparel. A 10-inch-wide print therefore wants roughly 3000 pixels across — a logo exported for a website at 500px will look noticeably soft.
Does a screen preview replace a physical sample?
No. A preview catches placement, scale, and contrast problems, which is most of them. It can’t tell you how the ink feels, how the print survives a wash, or exactly how the color renders on that specific fabric.
Is my design uploaded anywhere?
No. The previewer runs entirely in your browser with no uploads or external connections, so unreleased artwork stays on your own machine.
Final thought
Preview on the darkest shirt you plan to sell, not the lightest. If the design survives that, it’ll survive everything else — and you’ll have caught the expensive mistake before the order rather than after it.