5d:I[333483,["/creators-assets/_next/static/immutable/chunks/356g_j0l71_46.js","/creators-assets/_next/static/immutable/chunks/15s1ft4k9lx-7.js","/creators-assets/_next/static/immutable/chunks/0x8sumr53pdkk.js","/creators-assets/_next/static/immutable/chunks/3pud1dqsw0-_7.js","/creators-assets/_next/static/immutable/chunks/1m75iqpnspynu.js","/creators-assets/_next/static/immutable/chunks/0c6romi9ma0is.js","/creators-assets/_next/static/immutable/chunks/3ohf-5_4hfjuq.js","/creators-assets/_next/static/immutable/chunks/2jjhfe7-w6y9a.js","/creators-assets/_next/static/immutable/chunks/325i2v5l4tnlq.js","/creators-assets/_next/static/immutable/chunks/0kisxyo3aw231.js","/creators-assets/_next/static/immutable/chunks/2b1mm8iiske-y.js","/creators-assets/_next/static/immutable/chunks/0i7m0zg6jfazw.js","/creators-assets/_next/static/immutable/chunks/3-hmotkz_bdv_.js","/creators-assets/_next/static/immutable/chunks/06bqtx1jsc1kz.js","/creators-assets/_next/static/immutable/chunks/3q5wansxm4vp6.js","/creators-assets/_next/static/immutable/chunks/14h9277o22-rl.js","/creators-assets/_next/static/immutable/chunks/3naniu4pnqfyw.js","/creators-assets/_next/static/immutable/chunks/2-y_r3u4wh2s3.js","/creators-assets/_next/static/immutable/chunks/456d4lcv9-syj.js","/creators-assets/_next/static/immutable/chunks/36-o7-3julke0.js","/creators-assets/_next/static/immutable/chunks/2xq6uu2rcdc2i.js","/creators-assets/_next/static/immutable/chunks/2y9gv91n8o3i9.js","/creators-assets/_next/static/immutable/chunks/41i4r4u9uolgz.js","/creators-assets/_next/static/immutable/chunks/02ciyo_cdpkrz.js","/creators-assets/_next/static/immutable/chunks/3e73rezw4k1a2.js","/creators-assets/_next/static/immutable/chunks/15q00pdqk0br3.js","/creators-assets/_next/static/immutable/chunks/293prjxu_wz0c.js","/creators-assets/_next/static/immutable/chunks/0l9v835j421-s.js","/creators-assets/_next/static/immutable/chunks/40oma2w708rd-.js","/creators-assets/_next/static/immutable/chunks/2x7-2b3jcc9x7.js","/creators-assets/_next/static/immutable/chunks/3_pg4jxj9aiiw.js","/creators-assets/_next/static/immutable/chunks/3k6sa9ujkqb5c.js","/creators-assets/_next/static/immutable/chunks/3l2h8slpbzxqo.js","/creators-assets/_next/static/immutable/chunks/2xgtw4s-tlhet.js","/creators-assets/_next/static/immutable/chunks/3b306xa-3tb7g.js","/creators-assets/_next/static/immutable/chunks/2fvzgkzqkig_w.js","/creators-assets/_next/static/immutable/chunks/3g6klxxyg4m8-.js","/creators-assets/_next/static/immutable/chunks/0qx5rzvbsd7bx.js","/creators-assets/_next/static/immutable/chunks/1cphzzg2t2qo2.js"],"PostDetailCard"] 5e:T81f,

iPhone Mock is a phone frame u drop an image or a video into, and the whole handset is drawn in CSS so it stays sharp from a thumbnial all the way up to a full bleed hero. Every part of it is a control, so if the island or the side buttons arent right for the page ur building u can jsut turn them off.

Features

image or video, upload an MP4 or paste a link
the iPhone is drawn, not an image, so it stays sharp at any size
Island, notch or nothing, and the screen goes 9:19.5, 9:16, 3:4 or ur own ratio
bezel, corner radius, island and home bar are all a share of the width, so nothing distorts when it scales
no measuring pass, so it never flashes an empty box before it draws
draws the real thing on the canvas, in exports and in thumbnails, not a grey placeholder
video pauses itself when it scrolls out of view, and only restarts the ones it paused, so a video u stopped by hand stays stopped
respects reduce motion, and the media takes a screen reader label

Customization

Six groups so u dont have to hunt, Content and Screen are the ones u actually touch, Playback only turns up when ur showing a video. Recolour the frame, the buttons, the bar and the screen behind the media, set the border width and the roundness, and the side rails, home bar, glare and shadow each swtich off on there own. Crop to fit, show all or stretch, plus a focus point and a zoom for when the shot isnt framed how u want it.

Perfect for

app landing pages
porduct and feature launches
agency and studio sites
portfolio case studies
anywhere u want a screenshot to actually look like a phone

Support

Something broken or u just want a hand setting it up, reach me at mail at kaialanrazz@gmail.com or X and il get back to u

5a:[["$","$L5d",null,{"post":{"id":"01a0862f-c451-770e-b307-fa38f2b8a51d","title":null,"body":null,"bodyJson":null,"author":{"framerUserId":"723a2aad-93c4-4641-94ac-379b34eb8fa4","name":"Kaialan Razz","slug":"kaialan","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/723a2aad-93c4-4641-94ac-379b34eb8fa4/mx72pqf7","followed":false,"followsYou":false},"media":[],"resources":[{"id":"LSYczKfOVoqOBcD8UljI","resolved":true,"title":"iPhone Mock","body":"$5e","bodyJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"iPhone Mock is a phone frame u drop an image or a video into, and the whole handset is drawn in CSS so it stays sharp from a thumbnial all the way up to a full bleed hero. Every part of it is a control, so if the island or the side buttons arent right for the page ur building u can jsut turn them off."}]},{"type":"customHeading","content":[{"type":"text","text":"Features","marks":[{"type":"bold"}]}],"attrs":{"level":2}},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"image or video, upload an MP4 or paste a link"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"the iPhone is drawn, not an image, so it stays sharp at any size"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Island, notch or nothing, and the screen goes 9:19.5, 9:16, 3:4 or ur own ratio"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"bezel, corner radius, island and home bar are all a share of the width, so nothing distorts when it scales"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"no measuring pass, so it never flashes an empty box before it draws"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"draws the real thing on the canvas, in exports and in thumbnails, not a grey placeholder"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"video pauses itself when it scrolls out of view, and only restarts the ones it paused, so a video u stopped by hand stays stopped"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"respects reduce motion, and the media takes a screen reader label"}]}]}]},{"type":"customHeading","content":[{"type":"text","text":"Customization","marks":[{"type":"bold"}]}],"attrs":{"level":2}},{"type":"paragraph","content":[{"type":"text","text":"Six groups so u dont have to hunt, Content and Screen are the ones u actually touch, Playback only turns up when ur showing a video. Recolour the frame, the buttons, the bar and the screen behind the media, set the border width and the roundness, and the side rails, home bar, glare and shadow each swtich off on there own. Crop to fit, show all or stretch, plus a focus point and a zoom for when the shot isnt framed how u want it."}]},{"type":"customHeading","content":[{"type":"text","text":"Perfect for","marks":[{"type":"bold"}]}],"attrs":{"level":2}},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"app landing pages"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"porduct and feature launches"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"agency and studio sites"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"portfolio case studies"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"anywhere u want a screenshot to actually look like a phone"}]}]}]},{"type":"customHeading","content":[{"type":"text","text":"Support","marks":[{"type":"bold"}]}],"attrs":{"level":2}},{"type":"paragraph","content":[{"type":"text","text":"Something broken or u just want a hand setting it up, reach me at mail at "},{"type":"text","text":"kaialanrazz@gmail.com","marks":[{"type":"link","attrs":{"rel":"noopener noreferrer nofollow","href":"mailto:kaialanrazz@gmail.com","target":"_blank"}}]},{"type":"text","text":" or X and il get back to u"}]}]},"introduction":"A device frame that fits any box","slug":"iphone-mock","author":{"framerUserId":"723a2aad-93c4-4641-94ac-379b34eb8fa4","name":"Kaialan Razz","slug":"kaialan","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/723a2aad-93c4-4641-94ac-379b34eb8fa4/mx72pqf7","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/723a2aad-93c4-4641-94ac-379b34eb8fa4/01a0862f-a6c8-721d-a685-cac4e446d48b.png","metadata":{"tint":{"h":0,"s":0,"l":57},"width":1600,"height":1200}}],"post":null,"createdAt":"2026-09-09T12:41:11.959Z","updatedAt":"2026-09-09T12:41:11.959Z","publishedAt":"2026-09-09T12:41:11.956Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":"https://hy.chujiqiqi.com/m/Iphone-mock-LUfUXl.js@XOqokS33VA10rNCvGKHU","previewUrl":"https://iphone-mocks.framer.website/","price":null,"paymentUrl":null,"workshop":false,"categories":[{"id":"7677fa83-43ce-41a2-a3fe-db438ec0fd33","name":"Interactive","slug":"interactive"}],"lastSaveId":"XOqokS33VA10rNCvGKHU","tags":[]}}],"contests":[],"categories":[],"tags":[],"likes":{"count":0,"liked":false},"comments":{"count":0},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2026-09-09T12:41:12.529Z","updatedAt":"2026-09-09T12:41:12.529Z","reported":false}}],"$L5f"]

Suggested for you