Device Mockups wrap your designs in realistic phone, tablet, laptop, and desktop frames. Use them to create professional presentations, app store screenshots, and portfolio pieces.
Applying a Device Mockup
- Select a frame with your design
- Open the Device Mockup panel (View > Device Mockups)
- Choose a device from the library
- Your design appears inside the device frame
Available Devices
Phones
- iPhone 15 Pro / Pro Max
- iPhone 15 / Plus
- iPhone SE
- Google Pixel 8 / Pro
- Samsung Galaxy S24
- Generic Android
Tablets
- iPad Pro 12.9" / 11"
- iPad Air
- iPad Mini
- Android Tablet
- Surface Pro
Laptops
- MacBook Pro 16" / 14"
- MacBook Air
- Windows Laptop
- Chromebook
Desktops
- iMac
- Studio Display
- Generic Monitor
- Ultrawide Display
Wearables
- Apple Watch (all sizes)
- Android Watch
Mockup Options
Color Variants
- Space Black / Silver / Gold (iPhones)
- Multiple color options per device
- Some devices have light and dark frames
Orientation
- Portrait / Landscape
- Automatic based on frame dimensions
- Manual override available
Perspective
- Flat - Straight-on view
- Isometric - 3D angled view
- Perspective - Realistic depth
- Custom rotation angles
Shadow Options
- None - Clean, flat appearance
- Soft - Subtle drop shadow
- Realistic - Multi-layer shadow with depth
Screen Effects
- Glare - Add screen reflection
- Notch/Dynamic Island - Show or hide
- Status Bar - Add realistic status bar
- Home Indicator - iOS bottom indicator
Working with Mockups
Updating Content
- Edit the source frame - mockup updates live
- Swap frames to show different screens
- Use scroll position to show different parts
Exporting
- Export mockup as PNG, JPG, or SVG
- Choose resolution (1x, 2x, 3x)
- Include or exclude shadow in export
Common Use Cases
- App Store Screenshots - Show app in device context
- Presentations - Professional design reviews
- Portfolio - Showcase mobile and web work
- Marketing - Product landing pages
- Social Media - Eye-catching posts
Tips
- Match device to your target platform
- Use consistent device colors across presentation
- Consider perspective for hero images
- Flat mockups work best for documentation
- Group multiple devices for comparison views