{How to} Make Computer Mockups

Ever wonder how people get those beautiful mockups you see on websites of designers, developers, course creators, etc?

Here’s a roundup of a few of my go-to places:

Multi Device Website Mockup Generator from TechSini

Hands down, the easiest way to generate mockups is this tool from TechSini.  Simply enter your website address – and BAM.  Instant mockup.  Then simply screenshot the image (I use the Chrome Extension Awesome Screenshot) and you’re done!



Another great option is Placeit.  With multiple layout options, you can get the exact look you need.  Easily upload the screenshot, crop and set the screen.  Done.  The downside is that it is paid – $8/image or a subscription plan.  However, if you make ALOT of mockups per month or time is money, this is a great option for you.

Smartmockups App

With Smartmockups App, you can easily present your digital projects in realistic environments.  Give it a test run with their free download and if you decide it’s for you – it’s a one-time payment of $69.


If you have Photoshop, you can also use:

Mockup World

With a TON of free downloadable Photoshop files, you can really personalize your look.  The downloadable files are PSD files with layers, so you may not be able to use them successfully in Canva or the like (disclaimer: I don’t know, I haven’t tried these with anything other than Photoshop).  But they are large (4000 px) and full-resolution, so the quality is very high.


Creative Market

For highly customizeable graphics, visit Creative Market and search for “laptop mockup” or “computer mockup” or whatever category you would like.  For as little as $2 you can get mockups to match your brand (or you client’s brand), like this one:

Comments are closed.