iPhone UI

Show off your app, website or product on a pair of iPhones that respond to the cursor. iPhone Duo is a drop-in Framer code component. It needs no image assets for the phones, so it stays sharp at any size and loads fast.

The phones are built entirely in CSS, with a titanium-style frame, side buttons, Dynamic Island and home indicator. Move your cursor over the component and the whole scene tilts in 3D with smooth spring physics. The front and back phones move at different depths for a parallax effect, and a soft glare follows the pointer across the screens. When idle, the phones float gently, and the pair scales up slightly on hover.

Features

• Two phones with independent screen images

• 3D tilt that follows the cursor, with spring physics

• Parallax depth between the front and back phones

• Moving glare highlight on the screens

• Floating idle animation

• Hover scale effect

• Fully responsive: it scales to fit any frame

• No external assets or dependencies

Customization (all from the properties panel)

• Front and back screen images

• Frame colour

• Dynamic Island on/off

• Tilt angle

• Spread between the phones

• Depth

• Float amount

• Hover scale

• Spring stiffness and damping

Great for App landing pages, SaaS hero sections, portfolios, product launches and template previews.

How to use Paste the component into a new Framer code component, drag it onto your canvas, and add your screenshots in the properties panel.

If you want a different tone (more minimal, or written for a Marketplace listing with a specific format), tell me and I’ll rework it.