51:I[267044,["/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/3z6ke99nzr4_e.js","/creators-assets/_next/static/immutable/chunks/3e73rezw4k1a2.js","/creators-assets/_next/static/immutable/chunks/40oma2w708rd-.js","/creators-assets/_next/static/immutable/chunks/1fkcqskfw4hol.js","/creators-assets/_next/static/immutable/chunks/3ixl4aqv6ylo7.js","/creators-assets/_next/static/immutable/chunks/2x7-2b3jcc9x7.js","/creators-assets/_next/static/immutable/chunks/2di2v55rtz-8i.js","/creators-assets/_next/static/immutable/chunks/3_pg4jxj9aiiw.js","/creators-assets/_next/static/immutable/chunks/0l9v835j421-s.js","/creators-assets/_next/static/immutable/chunks/0qx5rzvbsd7bx.js","/creators-assets/_next/static/immutable/chunks/3b306xa-3tb7g.js","/creators-assets/_next/static/immutable/chunks/3g6klxxyg4m8-.js","/creators-assets/_next/static/immutable/chunks/2fvzgkzqkig_w.js","/creators-assets/_next/static/immutable/chunks/00owjoob9gqs9.js","/creators-assets/_next/static/immutable/chunks/3k6sa9ujkqb5c.js"],"S"] 52:T86b,

Good news for Framer builders! 🎉 Sticky Viewport component is now live on the Framer Marketplace — your new go-to for pixel-perfect sticky positioning across different screen heights.

If you've ever nailed a sticky element on your screen, only to have it drift on a shorter laptop or a different device, you know the problem.

Framer’s native Sticky positioning uses a fixed offset, which can leave an element sitting too high or too low as viewport height changes.

Sticky Viewport closes that gap with a viewport-aware offset that keeps sticky elements accurately positioned across different screen heights — without writing a line of code.

That matters most for product demos and scroll-driven storytelling, where a video, animation, or layered element needs to stay optically aligned as the layout changes. Not just visible on screen, but sitting exactly where the story needs it to be.

Dynamic mode automatically scales the offset with viewport height.

Manual mode locks the offset to fixed tiers.

Both run on Framer’s native Sticky workflow — no custom code required.

🎥 Watch the short insight video below to see the difference: the demo browser changes viewport height in real time, showing how the positioning responds across different screen sizes, with Diagnostics providing live feedback along the way.

👉 Grab it on the Framer Marketplace

53:T51b,

Sticky Viewport component just went live. Here's why it's built the way it is.

A single fixed offset rarely holds up across different viewport heights. Sticky Viewport adapts the offset and makes the behavior visible: a live Diagnostics overlay confirms target status, sticky state, viewport height, and final position, both in Preview and on the published page.

Dynamic mode automatically scales with viewport height. Manual mode locks the offset to fixed tiers. Runs on Framer's native Sticky workflow, no custom code required.

Shots below: naming the target layer, Diagnostics mid-scroll showing Active sticky state, and Properties panel showing Dynamic vs Manual modes.

Full setup guide →

54:T41a,

Sticky Viewport is live on the Marketplace. Framer's native Sticky positioning uses one fixed offset that drifts across different screen sizes — Sticky Viewport keeps it responsive instead, working as a steady anchor for hero sections, sidebars, scroll-driven layouts, and more, with Dynamic auto-scaling or fixed Manual tiers and a built-in Diagnostics overlay to confirm it's actually working. No code. See the full guide with video + live demo →

55:Tc5b,

Overview

Framer's native sticky positioning uses a single fixed offset that rarely holds up across different viewport heights. Sticky Viewport adds a live, viewport-height-aware offset that adapts automatically, scaling continuously or switching between fixed tiers, while keeping Framer's native sticky workflow. Target any Frame or Stack with Position set to Sticky, then choose Stick To (Top or Bottom). Verify instantly with the built-in Diagnostics overlay in Preview and on published pages. No code required.

How to Set Up

Set the target layer's Position to Sticky and enable one native anchor (Top or Bottom).
Give it a unique name, e.g. Sticky Frame, then paste Sticky Viewport anywhere on the page. It's invisible and never affects layout.
Enter that name in Target Layer, then choose Stick To.
Open Preview: Diagnostics confirms Target Status Found and shows the applied offset under Final Position.
Calibrate Base Viewport and Base Offset to your breakpoint, fine-tune with Scale Factor if needed, then turn Diagnostics off before publishing.

Full step-by-step guide with tips and video:

Sticky Viewport Tutorial

Features

Dynamic Mode: auto-scales the offset with viewport height, with Min/Max safety bounds.
Manual Mode: up to three fixed tiers (Base/XL/XXL) in px or vh.
Top or Bottom sticky, with automatic height compensation for Bottom.
Live Diagnostics: target status, sticky state, viewport height, and final position, live and on published pages.
Safe by design: disabling the component restores the layer's original native sticky settings.

Made by Motion Dev Lab

License: Single-Use Commercial License, per Framer's Community Terms, for use in one end product.

Refund Policy: Digital product, all sales final once delivered. Review the properties and live demo before purchasing.

Questions, or need something custom built?

Email: support.motiondevlab@proton.me

50:["$","$L51",null,{"value":{"fallback":{"$inf$activity-creator-f1997a7f-e9e5-45b2-af7b-4eed3d61dc9b-all:/unified/creator/f1997a7f-e9e5-45b2-af7b-4eed3d61dc9b/activity/":[{"data":[{"id":"01a00209-2763-74b3-8501-f6154c2bffc5","type":"creator.followed","target":{"type":"creator","id":"93fe0f52-d660-45da-8916-b8aa7d649dd8","preview":"VictorFlow","previewJson":null,"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/29123/victorflow-800-2Vq6Qq5f4oprXpElBeptTrdqc1pASD.jpg","slug":"victorflow","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"f1997a7f-e9e5-45b2-af7b-4eed3d61dc9b","name":"MotionDevLab","avatar":"https://framerusercontent.com/avatars/users/f1997a7f-e9e5-45b2-af7b-4eed3d61dc9b/1u-rcf5T1","slug":"motion-dev-lab","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-08-14T20:49:09.472Z","latestAt":"2026-08-14T20:49:09.472Z"},{"id":"01a00207-a2bb-728e-a83d-26abf7feb9cf","type":"component.liked","target":{"type":"component","id":"xPA6QveIMbtp51FeqJAB","preview":"Smooth Full-Page Web","previewJson":null,"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/9c9bddb0-da98-4a1e-b0c1-6ee644bffb7a/01a00703-cc9e-7614-b3c1-1f2a63a8680b.png","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"f1997a7f-e9e5-45b2-af7b-4eed3d61dc9b","name":"MotionDevLab","avatar":"https://framerusercontent.com/avatars/users/f1997a7f-e9e5-45b2-af7b-4eed3d61dc9b/1u-rcf5T1","slug":"motion-dev-lab","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":"component","visibility":"public","startedAt":"2026-08-14T20:47:29.974Z","latestAt":"2026-08-14T20:47:29.974Z"},{"id":"01a000f0-1481-77ec-8cd5-f5affcc1df59","type":"creator.followed","target":{"type":"creator","id":"ed7a652c-c737-4b37-b2d9-3dc6785e6001","preview":"Figure Design","previewJson":null,"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1224565/hSyBaeuaD-dX9VFzDheIM2TMmaCVMfleOZYJrxXa","slug":"figure-design","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"f1997a7f-e9e5-45b2-af7b-4eed3d61dc9b","name":"MotionDevLab","avatar":"https://framerusercontent.com/avatars/users/f1997a7f-e9e5-45b2-af7b-4eed3d61dc9b/1u-rcf5T1","slug":"motion-dev-lab","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-08-14T15:42:09.018Z","latestAt":"2026-08-14T15:42:09.018Z"},{"id":"01a000ef-e469-7089-ae0e-55f0603be3b3","type":"creator.followed","target":{"type":"creator","id":"b0e5c9d4-d334-42e5-9310-ba59dc527712","preview":"Maxim Honcharov","previewJson":null,"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/286384/UAPIg-4pZ-lMM4DILObGl9kVD1jrjhnRSCqWEYMx","slug":"maxim-honcharov","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"f1997a7f-e9e5-45b2-af7b-4eed3d61dc9b","name":"MotionDevLab","avatar":"https://framerusercontent.com/avatars/users/f1997a7f-e9e5-45b2-af7b-4eed3d61dc9b/1u-rcf5T1","slug":"motion-dev-lab","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-08-14T15:41:56.708Z","latestAt":"2026-08-14T15:41:56.708Z"},{"id":"01a000ef-d849-728d-ba26-83a084091cd6","type":"creator.followed","target":{"type":"creator","id":"b4594bdb-37fa-4403-8d0b-0fc0d99ac85e","preview":"Profound Labs","previewJson":null,"thumbnail":null,"slug":"joe-gourieh","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"f1997a7f-e9e5-45b2-af7b-4eed3d61dc9b","name":"MotionDevLab","avatar":"https://framerusercontent.com/avatars/users/f1997a7f-e9e5-45b2-af7b-4eed3d61dc9b/1u-rcf5T1","slug":"motion-dev-lab","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-08-14T15:41:53.597Z","latestAt":"2026-08-14T15:41:53.597Z"},{"id":"01a000ef-d44c-7602-942c-0dae6cb05ae1","type":"creator.followed","target":{"type":"creator","id":"ce1e0ad6-ef17-4682-b6bb-1b6f9cb820a7","preview":"ScaleUp SEO","previewJson":null,"thumbnail":null,"slug":"scaleup-seo","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"f1997a7f-e9e5-45b2-af7b-4eed3d61dc9b","name":"MotionDevLab","avatar":"https://framerusercontent.com/avatars/users/f1997a7f-e9e5-45b2-af7b-4eed3d61dc9b/1u-rcf5T1","slug":"motion-dev-lab","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-08-14T15:41:52.582Z","latestAt":"2026-08-14T15:41:52.582Z"},{"id":"01a000ef-ce02-706e-96d6-f5d60ec6d48b","type":"creator.followed","target":{"type":"creator","id":"8e6b6ac0-8182-47e2-97ce-9364c0e8bbe8","preview":"ANGGORA®","previewJson":null,"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1019390/R5MgDpQRm-hUWy8l2SPTA7swvDy1CqSdy5uAbUjM","slug":"anggora","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"f1997a7f-e9e5-45b2-af7b-4eed3d61dc9b","name":"MotionDevLab","avatar":"https://framerusercontent.com/avatars/users/f1997a7f-e9e5-45b2-af7b-4eed3d61dc9b/1u-rcf5T1","slug":"motion-dev-lab","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-08-14T15:41:50.971Z","latestAt":"2026-08-14T15:41:50.971Z"},{"id":"01a000ef-cabf-7586-9da6-1e835797c9ee","type":"creator.followed","target":{"type":"creator","id":"262ff0b5-9097-433e-bf5e-302e2d7ba71c","preview":"Shantanu Roy","previewJson":null,"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1087722/cBLdEg1Jt-UIlBzJNUNxJcDMU9bTEXgnLkL7BNCS","slug":"shantanuroy4141","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"f1997a7f-e9e5-45b2-af7b-4eed3d61dc9b","name":"MotionDevLab","avatar":"https://framerusercontent.com/avatars/users/f1997a7f-e9e5-45b2-af7b-4eed3d61dc9b/1u-rcf5T1","slug":"motion-dev-lab","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-08-14T15:41:50.138Z","latestAt":"2026-08-14T15:41:50.138Z"},{"id":"01a000ef-c13a-74dc-89c1-38a5b879971b","type":"creator.followed","target":{"type":"creator","id":"68f136b7-fb14-405e-bc26-f049f30da944","preview":"Telos DC","previewJson":null,"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/29267/avatar-k4D6WAESqY60GOdT2tgDoKqBAzePZ9.jpg","slug":"rafael-nogueira","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"f1997a7f-e9e5-45b2-af7b-4eed3d61dc9b","name":"MotionDevLab","avatar":"https://framerusercontent.com/avatars/users/f1997a7f-e9e5-45b2-af7b-4eed3d61dc9b/1u-rcf5T1","slug":"motion-dev-lab","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-08-14T15:41:47.689Z","latestAt":"2026-08-14T15:41:47.689Z"},{"id":"01a000ef-b6ad-74aa-a7f8-8880ba316fe6","type":"creator.followed","target":{"type":"creator","id":"f8498b4c-c7ab-4258-a472-6ed254a6ddea","preview":"Xavier Tan","previewJson":null,"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/305952/c73b7d0db6a5b6bf17c2778f2889b33b-HMfXNm7kKKO3o6vLruABsS6PBcJ77e","slug":"xavier-t","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"f1997a7f-e9e5-45b2-af7b-4eed3d61dc9b","name":"MotionDevLab","avatar":"https://framerusercontent.com/avatars/users/f1997a7f-e9e5-45b2-af7b-4eed3d61dc9b/1u-rcf5T1","slug":"motion-dev-lab","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-08-14T15:41:44.999Z","latestAt":"2026-08-14T15:41:44.999Z"},{"id":"01a000ef-b34a-73fe-b265-7ec1fc4b70d6","type":"creator.followed","target":{"type":"creator","id":"f8d7dd2f-68a9-4ffb-ac2d-47b48974a60d","preview":"Yunis Mikayilov","previewJson":null,"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/137761/avatar-faqRemA2g9pN2Ub8lurD8C01a8e8rA.jpg","slug":"yunismikayilov","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"f1997a7f-e9e5-45b2-af7b-4eed3d61dc9b","name":"MotionDevLab","avatar":"https://framerusercontent.com/avatars/users/f1997a7f-e9e5-45b2-af7b-4eed3d61dc9b/1u-rcf5T1","slug":"motion-dev-lab","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-08-14T15:41:44.130Z","latestAt":"2026-08-14T15:41:44.130Z"},{"id":"01a000ef-b0d2-7659-85b5-508def9bbcb9","type":"creator.followed","target":{"type":"creator","id":"65528038-8ae0-4a80-8e23-bb6037e65b8c","preview":"Dennis","previewJson":null,"thumbnail":null,"slug":"dennis-metselaar","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"f1997a7f-e9e5-45b2-af7b-4eed3d61dc9b","name":"MotionDevLab","avatar":"https://framerusercontent.com/avatars/users/f1997a7f-e9e5-45b2-af7b-4eed3d61dc9b/1u-rcf5T1","slug":"motion-dev-lab","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-08-14T15:41:43.498Z","latestAt":"2026-08-14T15:41:43.498Z"},{"id":"01a000ef-ad4a-721d-8b69-5d5f8dfef070","type":"creator.followed","target":{"type":"creator","id":"6614c20d-e925-4ab3-a648-5e15d7874d5f","preview":"Beyo Co., Ltd.","previewJson":null,"thumbnail":null,"slug":"beyo-b","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"f1997a7f-e9e5-45b2-af7b-4eed3d61dc9b","name":"MotionDevLab","avatar":"https://framerusercontent.com/avatars/users/f1997a7f-e9e5-45b2-af7b-4eed3d61dc9b/1u-rcf5T1","slug":"motion-dev-lab","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-08-14T15:41:42.597Z","latestAt":"2026-08-14T15:41:42.597Z"},{"id":"01a000ef-aa65-774c-ba78-5eb0f0123481","type":"creator.followed","target":{"type":"creator","id":"965790f8-1d16-4c6f-bcee-953aa89a567d","preview":"Lucas Leles","previewJson":null,"thumbnail":null,"slug":"lucas-leles","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"f1997a7f-e9e5-45b2-af7b-4eed3d61dc9b","name":"MotionDevLab","avatar":"https://framerusercontent.com/avatars/users/f1997a7f-e9e5-45b2-af7b-4eed3d61dc9b/1u-rcf5T1","slug":"motion-dev-lab","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-08-14T15:41:41.851Z","latestAt":"2026-08-14T15:41:41.851Z"},{"id":"01a000ef-9d15-7576-8f0e-e62fc7997403","type":"creator.followed","target":{"type":"creator","id":"3fc7254b-9b8e-485f-8c27-4b2e3a58bbab","preview":"Lets Build My App","previewJson":null,"thumbnail":null,"slug":"alex-dow-nb9l8","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"f1997a7f-e9e5-45b2-af7b-4eed3d61dc9b","name":"MotionDevLab","avatar":"https://framerusercontent.com/avatars/users/f1997a7f-e9e5-45b2-af7b-4eed3d61dc9b/1u-rcf5T1","slug":"motion-dev-lab","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-08-14T15:41:38.448Z","latestAt":"2026-08-14T15:41:38.448Z"},{"id":"01a000ef-92cc-7779-affd-233843926040","type":"creator.followed","target":{"type":"creator","id":"402aa841-67ff-46d3-b720-318d6eae189f","preview":"Dylan's Workspace","previewJson":null,"thumbnail":null,"slug":"dylan-nguyen","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"f1997a7f-e9e5-45b2-af7b-4eed3d61dc9b","name":"MotionDevLab","avatar":"https://framerusercontent.com/avatars/users/f1997a7f-e9e5-45b2-af7b-4eed3d61dc9b/1u-rcf5T1","slug":"motion-dev-lab","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-08-14T15:41:35.806Z","latestAt":"2026-08-14T15:41:35.806Z"},{"id":"01a000ef-8f50-779f-8a7c-2f7985a3526a","type":"creator.followed","target":{"type":"creator","id":"625c6286-c802-4537-82ed-817550b4223a","preview":"Justin Wagoner","previewJson":null,"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/37476/0IBseDmTL-75KRZwzB2lFQz5hDxv7DsqJdkjntuG","slug":"justin-wagoner","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"f1997a7f-e9e5-45b2-af7b-4eed3d61dc9b","name":"MotionDevLab","avatar":"https://framerusercontent.com/avatars/users/f1997a7f-e9e5-45b2-af7b-4eed3d61dc9b/1u-rcf5T1","slug":"motion-dev-lab","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-08-14T15:41:34.923Z","latestAt":"2026-08-14T15:41:34.923Z"},{"id":"01a000ef-8bbf-777e-b82f-705d9bce3319","type":"creator.followed","target":{"type":"creator","id":"df66c977-b2f5-41da-baa1-dc42c3b1fda0","preview":"A0","previewJson":null,"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/130498/avatar-zsW8u5ZWCBqsaLXiuths86d0fZmI3O.jpg","slug":"a0","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"f1997a7f-e9e5-45b2-af7b-4eed3d61dc9b","name":"MotionDevLab","avatar":"https://framerusercontent.com/avatars/users/f1997a7f-e9e5-45b2-af7b-4eed3d61dc9b/1u-rcf5T1","slug":"motion-dev-lab","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-08-14T15:41:34.007Z","latestAt":"2026-08-14T15:41:34.007Z"},{"id":"01a000ef-85f3-72c9-80b6-cdec50148947","type":"creator.followed","target":{"type":"creator","id":"d4255373-02b6-451c-b634-47f6f77bb066","preview":"Will Hobick","previewJson":null,"thumbnail":null,"slug":"will-hobick","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"f1997a7f-e9e5-45b2-af7b-4eed3d61dc9b","name":"MotionDevLab","avatar":"https://framerusercontent.com/avatars/users/f1997a7f-e9e5-45b2-af7b-4eed3d61dc9b/1u-rcf5T1","slug":"motion-dev-lab","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-08-14T15:41:32.523Z","latestAt":"2026-08-14T15:41:32.523Z"},{"id":"01a000ef-76f5-7187-abea-3dfad809a872","type":"creator.followed","target":{"type":"creator","id":"2de9542d-77c3-4509-bfc4-c40dc5436cb4","preview":"Akshat Singh","previewJson":null,"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/950755/avatar-Cgp4iknAe44iccpLWzkQ6KDdJ5YpWl.jpg","slug":"atlas","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"f1997a7f-e9e5-45b2-af7b-4eed3d61dc9b","name":"MotionDevLab","avatar":"https://framerusercontent.com/avatars/users/f1997a7f-e9e5-45b2-af7b-4eed3d61dc9b/1u-rcf5T1","slug":"motion-dev-lab","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-08-14T15:41:28.685Z","latestAt":"2026-08-14T15:41:28.685Z"}],"pagination":{"next":"MjAyNi0wOC0xNFQxNTo0MToyOC42ODVafDAxYTAwMGVmLTc2ZjUtNzE4Ny1hYmVhLTNkZmFkODA5YTg3Mg","previous":null},"totalCount":"$undefined","feedSession":"$undefined"}],"$inf$posts:f1997a7f-e9e5-45b2-af7b-4eed3d61dc9b:/unified/posts/?creator=f1997a7f-e9e5-45b2-af7b-4eed3d61dc9b&with=reposts":[{"data":[{"id":"019fed1a-34cf-702f-9e15-a848f8c28cf6","title":null,"body":"$52","bodyJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"Good news for Framer builders! ","marks":[{"type":"bold"}]},{"type":"emoji","attrs":{"name":"tada","emoji":"🎉"}},{"type":"text","text":" ","marks":[{"type":"bold"}]},{"type":"text","text":"Sticky Viewport","marks":[{"type":"link","attrs":{"rel":"noopener noreferrer","href":"https://framer.link/9ovbSvm?utm_source=framer_community&utm_medium=post&utm_campaign=sticky_viewport_launch&utm_content=feed_post_3_inline","target":"_blank"}},{"type":"bold"}]},{"type":"text","text":" component is now live on the Framer Marketplace — your new go-to for pixel-perfect sticky positioning across different screen heights.","marks":[{"type":"bold"}]}]},{"type":"paragraph","content":[{"type":"text","text":"If you've ever nailed a sticky element on your screen, only to have it drift on a shorter laptop or a different device, you know the problem."}]},{"type":"paragraph","content":[{"type":"text","text":"Framer’s native Sticky positioning uses a fixed offset, which can leave an element sitting too high or too low as viewport height changes."}]},{"type":"paragraph","content":[{"type":"text","text":"Sticky Viewport closes that gap with a viewport-aware offset that keeps sticky elements accurately positioned across different screen heights — without writing a line of code."}]},{"type":"paragraph","content":[{"type":"text","text":"That matters most for product demos and scroll-driven storytelling, where a video, animation, or layered element needs to stay optically aligned as the layout changes. Not just visible on screen, but sitting exactly where the story needs it to be."}]},{"type":"paragraph","content":[{"type":"text","text":"Dynamic mode","marks":[{"type":"bold"}]},{"type":"text","text":" automatically scales the offset with viewport height."}]},{"type":"paragraph","content":[{"type":"text","text":"Manual mode","marks":[{"type":"bold"}]},{"type":"text","text":" locks the offset to fixed tiers."}]},{"type":"paragraph","content":[{"type":"text","text":"Both run on Framer’s native Sticky workflow — no custom code required."}]},{"type":"paragraph","content":[{"type":"emoji","attrs":{"name":"movie_camera","emoji":"🎥"}},{"type":"text","text":" "},{"type":"text","text":"Watch the short insight video below to see the difference:","marks":[{"type":"bold"}]},{"type":"text","text":" the demo browser changes viewport height in real time, showing how the positioning responds across different screen sizes, with Diagnostics providing live feedback along the way."}]},{"type":"paragraph","content":[{"type":"emoji","attrs":{"name":"point_right","emoji":"👉"}},{"type":"text","text":" "},{"type":"text","text":"Grab it on the Framer Marketplace","marks":[{"type":"link","attrs":{"rel":"noopener noreferrer","href":"https://framer.link/9ovbSvm?utm_source=framer_community&utm_medium=post&utm_campaign=sticky_viewport_launch&utm_content=feed_post_3_cta","target":"_blank"}},{"type":"bold"}]}]}]},"author":{"framerUserId":"f1997a7f-e9e5-45b2-af7b-4eed3d61dc9b","name":"MotionDevLab","slug":"motion-dev-lab","avatar":"https://framerusercontent.com/avatars/users/f1997a7f-e9e5-45b2-af7b-4eed3d61dc9b/1u-rcf5T1","followed":false,"followsYou":false},"media":[{"type":"video","url":"https://stream.mux.com/vO35XGrs01z4WS00OkKMtMZBNJrMbvnmRQJXMsoT01daPk.m3u8","metadata":{"posterUrl":"https://image.mux.com/vO35XGrs01z4WS00OkKMtMZBNJrMbvnmRQJXMsoT01daPk/thumbnail.webp?time=6.333","aspectRatio":"4:3","duration":27.626}}],"resources":[],"contests":[],"categories":[{"id":"cf35162f-8406-49a9-a023-4c58024795ee","name":"General","slug":"general","description":"General","metaTitle":"General","metaDescription":"General"}],"tags":[],"likes":{"count":25,"liked":false},"comments":{"count":3},"reposts":{"count":2,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2026-08-10T19:15:45.501Z","updatedAt":"2026-08-10T19:15:45.501Z"},{"id":"019fde5f-9ec1-7310-9a5a-96514edbafc6","title":null,"body":"$53","bodyJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"Sticky Viewport","marks":[{"type":"link","attrs":{"rel":"noopener noreferrer","href":"https://framer.link/9ovbSvm?utm_source=framer_community&utm_medium=post&utm_campaign=sticky_viewport_launch&utm_content=feed_post_2","target":"_blank"}},{"type":"bold"}]},{"type":"text","text":" component just went live. Here's why it's built the way it is.","marks":[{"type":"bold"}]}]},{"type":"paragraph","content":[{"type":"text","text":"A single fixed offset rarely holds up across different viewport heights. "},{"type":"text","text":"Sticky Viewport","marks":[{"type":"bold"}]},{"type":"text","text":" adapts the offset and makes the behavior visible: a live "},{"type":"text","text":"Diagnostics","marks":[{"type":"bold"}]},{"type":"text","text":" overlay confirms target status, sticky state, viewport height, and final position, both in Preview and on the published page."}]},{"type":"paragraph","content":[{"type":"text","text":"Dynamic mode","marks":[{"type":"bold"}]},{"type":"text","text":" automatically scales with viewport height. "},{"type":"text","text":"Manual mode","marks":[{"type":"bold"}]},{"type":"text","text":" locks the offset to fixed tiers. Runs on Framer's native Sticky workflow, no custom code required."}]},{"type":"paragraph","content":[{"type":"text","text":"Shots below: naming the target layer, Diagnostics mid-scroll showing Active sticky state, and Properties panel showing Dynamic vs Manual modes."}]},{"type":"paragraph","content":[{"type":"text","text":"Full setup guide →","marks":[{"type":"link","attrs":{"rel":"noopener noreferrer","href":"https://motiondevlab.com/components/sticky-viewport/overview?utm_source=framer_community&utm_medium=post&utm_campaign=sticky_viewport_launch&utm_content=screenshots","target":"_blank"}},{"type":"bold"}]}]}]},"author":{"framerUserId":"f1997a7f-e9e5-45b2-af7b-4eed3d61dc9b","name":"MotionDevLab","slug":"motion-dev-lab","avatar":"https://framerusercontent.com/avatars/users/f1997a7f-e9e5-45b2-af7b-4eed3d61dc9b/1u-rcf5T1","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/f1997a7f-e9e5-45b2-af7b-4eed3d61dc9b/019fddd3-0a91-731a-81c6-7f1922111756.png","metadata":{"tint":{"h":300,"s":50,"l":6},"width":3072,"height":2304}},{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/f1997a7f-e9e5-45b2-af7b-4eed3d61dc9b/019fddd3-2f85-700e-b32b-0eab4d2d8219.png","metadata":{"tint":{"h":270,"s":67,"l":9},"width":3072,"height":2304}},{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/f1997a7f-e9e5-45b2-af7b-4eed3d61dc9b/019fddd3-751b-77aa-86db-04c90f6bcdc8.png","metadata":{"tint":{"h":0,"s":0,"l":3},"width":3072,"height":2304}}],"resources":[],"contests":[],"categories":[{"id":"cf35162f-8406-49a9-a023-4c58024795ee","name":"General","slug":"general","description":"General","metaTitle":"General","metaDescription":"General"}],"tags":[],"likes":{"count":10,"liked":false},"comments":{"count":0},"reposts":{"count":0,"reposted":false,"repostId":null},"version":2,"edited":true,"editedAt":"2026-08-08T10:11:32.172Z","createdAt":"2026-08-07T22:37:16.357Z","updatedAt":"2026-08-08T10:11:32.172Z"},{"id":"019fdc43-f582-75ab-8008-8df9cecd7bce","title":null,"body":"$54","bodyJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"Sticky Viewport","marks":[{"type":"link","attrs":{"rel":"noopener noreferrer","href":"https://framer.link/9ovbSvm?utm_source=framer_community&utm_medium=post&utm_campaign=sticky_viewport_launch&utm_content=feed_post","target":"_blank"}},{"type":"bold"}]},{"type":"text","text":" is live on the Marketplace. Framer's native "},{"type":"text","text":"Sticky","marks":[{"type":"bold"}]},{"type":"text","text":" positioning uses one fixed offset that drifts across different screen sizes — "},{"type":"text","text":"Sticky Viewport","marks":[{"type":"bold"}]},{"type":"text","text":" keeps it responsive instead, working as a steady anchor for hero sections, sidebars, scroll-driven layouts, and more, with "},{"type":"text","text":"Dynamic","marks":[{"type":"bold"}]},{"type":"text","text":" auto-scaling or fixed "},{"type":"text","text":"Manual","marks":[{"type":"bold"}]},{"type":"text","text":" tiers and a built-in "},{"type":"text","text":"Diagnostics","marks":[{"type":"bold"}]},{"type":"text","text":" overlay to confirm it's actually working. No code. "},{"type":"text","text":"See the full guide with video + live demo","marks":[{"type":"link","attrs":{"rel":"noopener noreferrer","href":"https://motiondevlab.com/components/sticky-viewport/overview?utm_source=framer_community&utm_medium=post&utm_campaign=sticky_viewport_launch&utm_content=feed_post","target":"_blank"}},{"type":"bold"}]},{"type":"text","text":" ","marks":[{"type":"link","attrs":{"rel":"noopener noreferrer","href":"https://motiondevlab.com/components/sticky-viewport/overview?utm_source=framer_community&utm_medium=post&utm_campaign=sticky_viewport_launch&utm_content=feed_post","target":"_blank"}}]},{"type":"text","text":"→","marks":[{"type":"link","attrs":{"rel":"noopener noreferrer","href":"https://motiondevlab.com/components/sticky-viewport/overview?utm_source=framer_community&utm_medium=post&utm_campaign=sticky_viewport_launch&utm_content=feed_post","target":"_blank"}},{"type":"bold"}]}]}]},"author":{"framerUserId":"f1997a7f-e9e5-45b2-af7b-4eed3d61dc9b","name":"MotionDevLab","slug":"motion-dev-lab","avatar":"https://framerusercontent.com/avatars/users/f1997a7f-e9e5-45b2-af7b-4eed3d61dc9b/1u-rcf5T1","followed":false,"followsYou":false},"media":[],"resources":[{"id":"vkuzR5mo82m6gvNFPFzb","resolved":true,"title":"Sticky Viewport","body":"$55","bodyJson":{"type":"doc","content":[{"type":"customHeading","content":[{"type":"text","text":"Overview"}],"attrs":{"level":2}},{"type":"paragraph","content":[{"type":"text","text":"Framer's native sticky positioning uses a single fixed offset that rarely holds up across different viewport heights. "},{"type":"text","text":"Sticky Viewport","marks":[{"type":"bold"}]},{"type":"text","text":" adds a live, viewport-height-aware offset that adapts automatically, scaling continuously or switching between fixed tiers, while keeping Framer's native sticky workflow. Target any "},{"type":"text","text":"Frame","marks":[{"type":"bold"}]},{"type":"text","text":" or "},{"type":"text","text":"Stack","marks":[{"type":"bold"}]},{"type":"text","text":" with "},{"type":"text","text":"Position","marks":[{"type":"bold"}]},{"type":"text","text":" set to "},{"type":"text","text":"Sticky","marks":[{"type":"bold"}]},{"type":"text","text":", then choose "},{"type":"text","text":"Stick To","marks":[{"type":"bold"}]},{"type":"text","text":" ("},{"type":"text","text":"Top","marks":[{"type":"bold"}]},{"type":"text","text":" or "},{"type":"text","text":"Bottom","marks":[{"type":"bold"}]},{"type":"text","text":"). Verify instantly with the built-in "},{"type":"text","text":"Diagnostics","marks":[{"type":"bold"}]},{"type":"text","text":" overlay in "},{"type":"text","text":"Preview","marks":[{"type":"bold"}]},{"type":"text","text":" and on published pages. No code required."}]},{"type":"customHeading","content":[{"type":"text","text":"How to Set Up"}],"attrs":{"level":2}},{"type":"orderedList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Set the target layer's Position to "},{"type":"text","text":"Sticky","marks":[{"type":"bold"}]},{"type":"text","text":" and enable one native anchor ("},{"type":"text","text":"Top","marks":[{"type":"bold"}]},{"type":"text","text":" or "},{"type":"text","text":"Bottom","marks":[{"type":"bold"}]},{"type":"text","text":")."}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Give it a unique name, e.g. "},{"type":"text","text":"Sticky Frame","marks":[{"type":"bold"}]},{"type":"text","text":", then paste "},{"type":"text","text":"Sticky Viewport","marks":[{"type":"bold"}]},{"type":"text","text":" anywhere on the page. It's invisible and never affects layout."}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Enter that name in "},{"type":"text","text":"Target Layer","marks":[{"type":"bold"}]},{"type":"text","text":", then choose "},{"type":"text","text":"Stick To","marks":[{"type":"bold"}]},{"type":"text","text":"."}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Open "},{"type":"text","text":"Preview","marks":[{"type":"bold"}]},{"type":"text","text":": "},{"type":"text","text":"Diagnostics","marks":[{"type":"bold"}]},{"type":"text","text":" confirms Target Status "},{"type":"text","text":"Found","marks":[{"type":"bold"}]},{"type":"text","text":" and shows the applied offset under "},{"type":"text","text":"Final Position","marks":[{"type":"bold"}]},{"type":"text","text":"."}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Calibrate "},{"type":"text","text":"Base Viewport","marks":[{"type":"bold"}]},{"type":"text","text":" and "},{"type":"text","text":"Base Offset","marks":[{"type":"bold"}]},{"type":"text","text":" to your breakpoint, fine-tune with "},{"type":"text","text":"Scale Factor","marks":[{"type":"bold"}]},{"type":"text","text":" if needed, then turn "},{"type":"text","text":"Diagnostics","marks":[{"type":"bold"}]},{"type":"text","text":" off before publishing."}]}]}],"attrs":{"type":null,"start":1}},{"type":"customHeading","content":[{"type":"text","text":"Full step-by-step guide with tips and video: "}],"attrs":{"level":2}},{"type":"paragraph","content":[{"type":"text","text":"Sticky Viewport Tutorial","marks":[{"type":"link","attrs":{"rel":"noopener noreferrer","href":"https://motiondevlab.com/components/sticky-viewport/overview","target":"_blank"}},{"type":"bold"}]}]},{"type":"customHeading","content":[{"type":"text","text":"Features"}],"attrs":{"level":2}},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Dynamic Mode","marks":[{"type":"bold"}]},{"type":"text","text":": auto-scales the offset with viewport height, with "},{"type":"text","text":"Min/Max","marks":[{"type":"bold"}]},{"type":"text","text":" safety bounds."}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Manual Mode","marks":[{"type":"bold"}]},{"type":"text","text":": up to three fixed tiers ("},{"type":"text","text":"Base/XL/XXL","marks":[{"type":"bold"}]},{"type":"text","text":") in "},{"type":"text","text":"px","marks":[{"type":"bold"}]},{"type":"text","text":" or "},{"type":"text","text":"vh","marks":[{"type":"bold"}]},{"type":"text","text":"."}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Top or Bottom","marks":[{"type":"bold"}]},{"type":"text","text":" sticky, with automatic height compensation for Bottom."}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Live Diagnostics","marks":[{"type":"bold"}]},{"type":"text","text":": target status, sticky state, viewport height, and final position, live and on published pages."}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Safe by design","marks":[{"type":"bold"}]},{"type":"text","text":": disabling the component restores the layer's original native sticky settings."}]}]}]},{"type":"paragraph"},{"type":"paragraph","content":[{"type":"text","text":"Made by "},{"type":"text","text":"Motion Dev Lab","marks":[{"type":"link","attrs":{"rel":"noreferrer noopener","href":"https://motiondevlab.com/","target":"_blank"}}]}]},{"type":"paragraph","content":[{"type":"text","text":"License:","marks":[{"type":"bold"}]},{"type":"text","text":" Single-Use Commercial License, per Framer's "},{"type":"text","text":"Community Terms","marks":[{"type":"link","attrs":{"rel":"noopener noreferrer","href":"https://re.chujiqiqi.com/legal/community-terms","target":"_blank"}}]},{"type":"text","text":", for use in one end product."}]},{"type":"paragraph","content":[{"type":"text","text":"Refund Policy:","marks":[{"type":"bold"}]},{"type":"text","text":" Digital product, all sales final once delivered. Review the properties and live demo before purchasing."}]},{"type":"paragraph","content":[{"type":"text","text":"Questions, or need something custom built?"}]},{"type":"paragraph","content":[{"type":"text","text":"Email: "},{"type":"text","text":"support.motiondevlab@proton.me","marks":[{"type":"link","attrs":{"rel":"noopener noreferrer nofollow","href":"mailto:support.motiondevlab@proton.me","target":"_blank"}}]}]}]},"introduction":"Responsive Sticky Positioning","slug":"sticky-viewport","author":{"framerUserId":"f1997a7f-e9e5-45b2-af7b-4eed3d61dc9b","name":"MotionDevLab","slug":"motion-dev-lab","avatar":"https://framerusercontent.com/avatars/users/f1997a7f-e9e5-45b2-af7b-4eed3d61dc9b/1u-rcf5T1","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/f1997a7f-e9e5-45b2-af7b-4eed3d61dc9b/019fdc3f-83cb-7618-b784-c6811e9318e5.png","metadata":{"tint":{"h":257,"s":58,"l":19},"width":1600,"height":1200}}],"post":null,"createdAt":"2026-08-07T12:47:48.643Z","updatedAt":"2026-08-10T18:33:53.882Z","publishedAt":"2026-08-07T12:47:48.637Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":null,"previewUrl":"https://motiondevlab.framer.website/components/sticky-viewport/marketplace-demo","price":"12","paymentUrl":"https://contra.com/payment-link/vng8nkq7-sticky-viewport-responsive-sticky-positioning-for-framer","workshop":false,"categories":[{"id":"7677fa83-43ce-41a2-a3fe-db438ec0fd33","name":"Interactive","slug":"interactive"}],"lastSaveId":"CvYA2viPRxbElxDPfwai","tags":[]}}],"contests":[],"categories":[],"tags":[],"likes":{"count":24,"liked":false},"comments":{"count":0},"reposts":{"count":0,"reposted":false,"repostId":null},"version":6,"edited":true,"editedAt":"2026-08-10T18:33:54.794Z","createdAt":"2026-08-07T12:47:49.122Z","updatedAt":"2026-08-10T18:33:54.794Z"}],"pagination":{"next":null,"previous":null},"totalCount":"$undefined","feedSession":"$undefined"}]}},"children":"$L56"}]