A CMS-connected case study section for Framer. Cards tilt into place as they scroll in, settle, then ease back as they pass — so the stack keeps depth instead of snapping flat. Built on Framer's native Appear and Scroll Transform effects. No code, no GSAP, no iframes.
Your receipt has two links: the component URL and the remix. You need both — the URL installs the card, the remix carries the CMS and the motion.
1. Paste the component URL onto your canvas. The card lands in your Assets panel. Copy the URL, don't open it in a browser — it's a module file, not a web page. On its own it is one static card; repetition and motion arrive in step 3.
2. Open the remix. Same component, already wired up: the CMS collection, five sample entries with images, and the scroll motion.
3. In the remix Layers panel, copy the layer named Case Studies and paste it into your project under Desktop. The collection, the entries and the animation all come with it.
4. Replace the five sample rows with your own work. You add a project by adding a row, not by duplicating a layer.
5. Select any card and clear the Link property — see below.
6. Open Site Settings → General and turn on the accessibility option.
Link arrives showing "Missing" — it pointed at a demo page that isn't in your project. Nothing is broken: click the × to clear it, or pick your own page and bind the Slug parameter underneath. Use the page picker, not a typed path — a typed /work/my-project resolves as a hostname and fails.
- Fully native — no libraries, embeds or iframes
- Seven CMS fields, including a metric slot for results
- Responsive at tablet and phone breakpoints
- Reduced-motion friendly with the accessibility setting on
- Designed for light backgrounds
Tip: fill in the Metric field. "+180% read time" beside a title beats a paragraph.
All sales are final. Questions, or a custom section? Email jkiu67550@gmail.com.
Made by 0SILVER
