About Device Mockups 2026
About
Device Mockups 2026 is a responsive Framer code component for website mockups, app showcases and product demos. Display images, videos or native Framer content inside Apple-inspired MacBook, iPad and iPhone frames. Connected content keeps its scrolling and links. Choose MacBook Pro, MacBook Air, MacBook Neo, iPad Pro, iPad Air, iPhone 18 Pro or Pro Max, with one device per instance. Includes rear views for iPad and iPhone, iPad orientation options and an optional live floor reflection.
What you can customize
Choose the device, view, finish, body colors, wallpaper, glare and shadows through Framer property controls. Upload images or videos, adjust their fit and position, or connect native Framer content. Set video playback, controls, poster and captions. Adjust reflection opacity, fade and gap. Built with scalable 2D SVG artwork and automatic height. No code editing needed. Reflections need visible overflow and space below.
Great for (examples)
Just a few ideas, use it anywhere your work benefits from being shown on a screen:
MacBook website mockups and web design portfolios
iPhone app previews and mobile UI showcases
iPad interfaces, tablet apps and digital publications
SaaS demos, dashboards and product landing pages
UI/UX case studies and client project presentations
Screen recordings, video previews and product walkthroughs
Scrollable Framer content and interactive screen demos
Wallpaper collections and visual design showcases
Share your build
If you ship something cool with it, post it on X and tag me @Matthias_Oel, or send it over. I’d love to see what you create.
Need help?
Questions or feedback? Reach me anytime: matthias@lmvision.de or on X @Matthias_Oel.
Need a matching component?
Explore more ways to present your work:
