Skip to content

iPhone Case Mockup

iPhone··PSD

iPhone Case Mockup

What's inside

  • Applications Photoshop
  • File Types PSD
  • License Free (see author's terms)
  • Author Mr.Mockup

This iPhone case mockup is one of the simpler ways to present a landing page or an app screen convincingly.

Good pick for app designers, startup teams or anyone putting together a portfolio. Tip: for recent iPhones, keep important UI clear of the notch or Dynamic Island area.

A screen inside a real device frame explains a product faster than a raw screenshot, which is why it shows up on so many landing pages and app store listings. Pair it with a second device from the same angle to show a responsive layout.

Works well for

  • A landing page
  • An app screen
  • A website on mobile

This is a free file from Mr.Mockup. When you click download you’ll land on their page to grab it.

What’s inside the iPhone Case Mockup PSD

Open it in Photoshop and you can change:

  • Screen design, placed through the smart object
  • Background colour
  • Screen glare and reflection layers

How to edit this iPhone Case Mockup in Photoshop

  1. Export your screen design as a PNG at the exact size of the screen smart object.
  2. In the Layers panel, find the layer with the small smart object icon and double-click it.
  3. Paste your design, resize it to fill the area, then save (Ctrl/Cmd + S) and close that tab.
  4. Lower the glare layer if it hides small text.
  5. Export a full-size image for your portfolio and a smaller one for social media.

Screenshots with a white background can blend into the bezel; a thin shadow or darker UI reads better.

Best uses for this iPhone Case Mockup

  • Use it as the cover image for a website on mobile in your portfolio.
  • Show a landing page to a client before it goes to print or production.
  • Present an Instagram story design in a client proposal or brand guide.

Before you download

  • Made by Mr.Mockup. The download size and format are listed on their page.
  • Built for Adobe Photoshop. A recent CC version handles the smart objects best.
  • Check the licence on the author’s page. Personal and commercial terms differ from file to file.
  • Check the smart object size before you design, so your artwork fits without stretching.

Need a different angle? The iphone mockups category has plenty more free PSD files.

Questions about this mockup

Can I use this iPhone mockup for client work?

That depends on the author's terms. The download page lists what is allowed; when in doubt, ask the author directly.

How do I add my design?

Open the file in Photoshop, double-click the smart object thumbnail, paste or place your artwork in the new tab, save it (Ctrl/Cmd + S) and close. The main file updates on its own.

Which Photoshop version do I need?

A recent Photoshop CC version is best. Older versions can open the file but sometimes have trouble with smart objects and effects.

What size should my screenshot be?

Open the screen smart object and check its canvas size in Image › Canvas Size. Paste your screenshot at that size so it stays sharp.

Advertisement