MockCity is a bulk mockup generator that automatically places your designs in PSD SmartObjects.
Try it for free in your browser! No sign up required. Photoshop is optional and supported via plugin.
Browse mockup template library
A growing selection of free mockup templates
OR
Drop your mockup PSD templates here
You can drop folders containing multiple PSD templates
Spending hours making mockups is a thing of the past
Discover the MockCity features that will make your life easier.
Multiple designs, multiple products, all at once
Generate mockups for multiple designs and multiple products with just a few clicks. Automated
mockup generation so that you can do more of what you love, not make mockups.
Visual editor with live mockup preview
Use the visual editor to set the SmartObject parameters and see an updated mockup preview
within seconds.
Perfect design size and position, every time
Experiment with the different Fit modes and Anchor positions to better
understand how they work and find the perfect size and alignment for your designs.
First-class PSD support
Native support for the industry standard PSD format. Drag and drop your own PSD templates.
All the work is done in your browser and your templates never leave your machine.
Save and restore SmartObject parameters
Determine the most optimal design size and position and save those parameters in .mct
config files. Next time simply load the config file to recover the SmartObject parameters.
Growing library of free mockup templates
Don't have your own PSD mockup templates? Use the ones in our free template library.
FAQ
Load one or more mockup templates from our free library or drag and drop your own PSD
templates.
You can download
free PSD mockup templates
or purchase
premium templates. You can make
changes to PSDs using free online editor
Photopea.
Drag and drop your designs in the design dropzones and use the visual editor to change the
design size and position.
Generate the mockups!
No, your files never leave your machine and all the work is done locally in your browser
window using Photopea, a web-based Photoshop
alternative.
It's also possible to connect MockCity to your local Photoshop installation using our .
Glitched/distorted
Fixed
If your design appears glitched similar to the above, it is likely due to a missing
displacement map in your PSD mockup template. If this is the case, you should have a separate
PSD alongside the primary mockup PSD that is named something like displacement.psd
You can fix your mockups by embedding your displacement map PSD in the mockup PSD by following
these steps:
Drag and drop the displacement map PSD onto the canvas and hide it by clicking its
icon.
Navigate the project layers until you find the SmartObject layer responsible for displaying
your design. If it has a displacement filter active, it will have a arrowhead pointing
downwards or to the right. The same SmartObject might appear in your PSD more than once, so
make sure you find the SmartObject that is visible and has the arrowhead.
Press the arrowhead to reveal the active Smart Filters and double-click the Displace
filter.
From the Source dropdown, select the displacement map PSD you just placed in the document.
You can adjust the horizontal and vertical parameters to change the intensity of the
displacement. The more intense the displacement, the more warped your design will appear.
Press OK once you're done.
Save this updated PSD from File > Save As PSD.
Load your new PSD into MockCity.
Under the hood, the MockCity mockup generator uses free web-based editor Photopea. Photopea, a project by Ivan Kutskir, brings a lot of Photoshop's functionality, including
SmartObjects, to the browser and is able to read and write PSD files.
Alternatively, you can also use our plugin for Photoshop to connect MockCity to your local Photoshop installation.
The best way to support MockCity is to upgrade to
and gain access to premium features. Additionally, you can also use our affiliate link when purchasing
premium PSD mockups from CreativeMarket. This will give us a small commission at no extra expense to you.
It would mean the world to us if you support MockCity by spreading the world and sharing our
mockup generator with others who might find it useful. If you have a larger audience, check
out our Affiliates program to earn commissions.