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:T8f8,

A complete case-study modal for a CMS collection. Click a project to open it over your grid, with a unique URL you can share:

yoursite.com/#ledger-dashboard

Deep linking is built in, so you don’t need a separate component.

Setup

Place one instance inside your collection item, bind its fields, and publish. Adding a project is as simple as adding a CMS item—there’s nothing to configure individually.

Three layouts

Choose Case Study, Photography, or Studio. Each layout arranges the sections differently. You can also define a custom order in one field:

ctx, i1, st1, p23, outcome

Sections without content automatically disappear, so shorter projects never leave empty headings or unwanted gaps.

The card

The card begins in greyscale. On hover, colour sweeps across the image, rule, and title as one continuous gesture.

Control the direction, duration, easing, edge softness, and resting opacity.

Typography

Six typography groups are included: Title, Subtitle, Label, Statement, Body, and Description.

Each group provides controls for font, weight, size, letter spacing, line height, colour, and paragraph spacing. Type scales responsively on narrower screens and stops at a minimum size you define.

Also handled

Escape key, overlay click, close button, and browser Back
A single scroll container that responds on the first gesture
Scroll-position restoration when the modal closes
Focus management and keyboard focus trapping
Mobile bottom-sheet layout with safe-area padding
Optional parallax for selected images
Automatic reduced-motion support
Static Canvas and export rendering
CMS rich text, including lists, headings, links, bold, and italics

Good to know

Content is supplied through CMS-bound component properties rather than designed layers. This allows every collection item to populate its own modal without manually wiring each project.

Modal content is not intended to replace an indexable CMS project page. If per-project SEO is important, use dedicated CMS pages instead.

53:T88c,

Case studies inside modals don’t normally have individual URLs. When someone asks to see a project, you can only send your homepage and tell them where to click.

Modal Deep Links gives every project a shareable address:

yoursite.com/#coastal-rebrand

Open a project and the URL updates
Share the link and its modal opens automatically
Browser Back and Forward stay synchronized
Escape and your existing close button are detected after closing

Setup

Place one instance anywhere on the page.

For reliable CMS URLs:

Add a text layer inside each project card
Bind it to the CMS Slug field
Name it ProjectSlug
Set it to 1 × 1 and 0% opacity
Don’t enable Hidden

Your project card and modal interaction should already work normally. This component adds URL synchronization; it doesn’t create the modal.

Controls

Slug Layer — Layer bound to your CMS Slug field.

Title Layer — Optional fallback for identifying projects by title.

Close Text — Exact text used by your modal’s close control.

Closed URL — Hash displayed after closing. Defaults to #projects.

Ignore — Titles or slugs that shouldn’t receive links, such as Coming Soon cards.

Automatic fallback

Without a slug layer, the component attempts to identify large linked image cards and creates URLs from their headings. A CMS slug layer is recommended because its URLs remain stable when titles change.

Good to know

Shows only a small marker on the Framer Canvas
Renders no visible interface on the published site
Works with existing Framer overlays and modal interactions
Designed for one-page portfolios with modal case studies
Dedicated CMS pages are recommended when per-project SEO matters

54:T429,

Why I Built It

With The Championships at Wimbledon just around the corner, I was inspired to build something for fellow tennis fans: a retro tennis game where players step onto the court and keep the rally alive.

The Challenge

I wanted to create something interactive, and the challenge was bringing together gameplay, animations, AI-generated code, and a Wimbledon-inspired experience into a single Framer project. Framer Agents helped generate and refine much of the game throughout the build.

Framer Agents

Framer Agents played a big role in building the game. They generated, refined, and debugged most of the gameplay, animations, and interactions, making it possible to turn the idea into a fully playable experience during the hackathon.

Features:

Retro pixel-art tennis gameplay
Wimbledon-inspired design
Interactive animations
Built entirely in Framer with Framer Agents

Play Now

See how long you can keep the rally alive.

55:T8a9,

Unlike a general page gate, it’s built specifically for unlocking downloadable files — including uploaded files, CMS-powered file URLs, custom file names, and download states.

🛠️ How to Set It Up

Add the component to your Framer page.
Choose your file source: upload a file or connect a CMS file URL.
Set the file name for the downloaded asset.
Add your password, or use Hidden Password Code for advanced setup.
Customise the text, colours, fonts, button, and layout.
Publish your page.

✨ Key Feature

🔐 Hidden Password Code mode using SHA-256

Generate a SHA-256 hash from your password and paste it into the component.
You can use any SHA-256 generator, for example: tools.keycdn.com/sha256-online-generator

🧩 Use Cases

🎨 Portfolio Downloads

Share case studies, lookbooks, credentials decks, or project files.

🤝 Client Handovers

Give clients a simple password step before accessing final assets.

📄 Private PDFs

Gate guides, reports, proposals, menus, or internal documents.

🛍️ Digital Products

Deliver eBooks, templates, worksheets, or premium downloads.

📊 Presentation Downloads

Share decks, media kits, press packs, and event materials.

🧲 Gated Resources

Offer exclusive downloads to selected visitors or campaign audiences.

🗂️ CMS Resource Libraries

Create password-gated downloads across CMS collection pages.

🌐 Demo

password-download.framer.website

56:T90e,

CMS Download Card lets you create modern downloadable file cards directly inside Framer using CMS collections or uploaded assets.

Display downloadable resources with clean layouts, hover interactions, thumbnails, metadata, and responsive styling. Perfect for documents, media kits, PDFs, presentations, downloads pages, client resources, portfolios, and gated content sections.

📁 Supports:

PDF
Word
Excel
MP4
SVG
PowerPoint
Most file formats supported by Framer CMS

🧩 Choose between 3 layouts:

Card
List
Bento

🛠️ Features

Open files in a new tab
Direct file download support
CMS-powered file URLs
Upload local files directly
Responsive layouts
Thumbnail support
Optional category tags
Hover effects and glow styling
Custom typography and spacing controls
Smooth animations
Works inside CMS Collection lists

🎨 Customise

Colours
Radius
Typography
Spacing
Hover styles
Glow effects
Layout variants

⚙️ How to use

Add the component to your page or CMS item
Connect a file URL or upload a file
Add optional image, title, subtitle, category, and metadata
Choose your layout style
Select download or open-in-new-tab behaviour
Customise the design from the properties panel

Demo

cms-download-card.framer.website

Refund Policy: This is a digital product, so refunds are not available after purchase. If you experience any issues or bugs, contact me and I will help resolve them.

57:T6cf,

Turn static thumbnails into interactive video previews. Users can preview content on hover, then open a clean lightbox for full playback.

What it’s for

Portfolio websites
Course previews
Product showcases
Media galleries

What’s included• Instant hover video preview• Click to open lightbox with autoplay• Progress bar and duration badge• Mute toggle• Automatic aspect ratio• Works with CMS collections

Hover to play uploaded videos instantly. Click to open a clean lightbox with autoplay. Includes a progress bar, duration badge, mute toggle, and automatic aspect ratio detection.

Built for CMS collections. Connect your fields and it works without extra setup.

How to use

Add the component - Drag the component onto your canvas
Connect a video file - Or paste a video URL
Adjust settings - (hover preview, lightbox, controls, progress colour, bar thickness, fonts)
CMS - If using CMS, bind fields from your collection

That’s it.

Hover to preview, click to watch.

On mobile, tap to preview, then tap again to watch.

58:T592,

Framer’s native Lightbox is visually stunning, but it lacks a clear functional cue.

Without a visible "close" button or instruction, users are often left guessing how to exit the expanded view, which can lead to a frustrating "trapped" feeling and higher bounce rates.

🚀 30-Second Setup

1. Enable Lightbox: Make sure the native Lightbox effect is active on your images.

2. Drag & Drop: Place the Lightbox Lite component anywhere on your page and make it Absolute.

3. Done: Your site now has a professional, intuitive exit interaction.

Demo: lightbox-lite.framer.website

💎 Need More Control?

If you want to add backdrop blur, custom close buttons, text modes, and hover effects, check out Lightbox Pro. It’s the ultimate styling toolkit for designers who want total control over their image presentation.

59:Tbe9,

Upgrade Framer's native Lightbox with premium controls, custom cursors, and refined styling - without changing your workflow.

Lightbox Pro is an invisible component that enhances every native Framer Lightbox on your page. Drop it onto your canvas, customise the settings, and instantly give your galleries a polished, professional feel.

🚀 How It Works

Enable Lightbox: Ensure Framer’s native Lightbox effect is active on your images.
Drop & Forget: Drag the LightboxPro component anywhere on your canvas. Make it absolute positioning, and won't affect your layout.
Customize: Use the Properties Panel to toggle your cursor, blur, and button styles.

Note: Lightbox Pro enhances Framer's native Lightbox. It doesn't create a lightbox itself.

✨ Key Features

Custom "X" Cursor: Eliminate user confusion with a clear, follow-the-mouse "X" on the backdrop that signals exactly how to exit.
Immersive Backdrop Blur: Add 0–20px of adjustable blur to isolate your content and focus attention where it matters.
Designer Close Button:

Styles: Minimal, Circle, Filled, or Outline.
Positions: Top Left, Right, or Center (always outside the image frame).
Hover States: Subtle Grow, Shrink, or None.

Text Mode: Swap the icon for custom text (e.g., "CLOSE") with full typography and styling control.
Smart Logic: Includes click-through protection so clicking the image itself won’t accidentally close the view.

💎 Why Lightbox Pro?

One component controls every Lightbox on your page
No need to reconnect or replace existing images
Lightweight and fast
Works seamlessly with Framer's native Lightbox

Perfect for portfolios, photographers, agencies and premium websites.

Demo: lightbox-pro.framer.website

Looking for something simpler? Check out Lightbox Lite - the free version featuring the custom X cursor.

Last update:

6 July

Refund Policy

This is a digital product, so refunds are not available after purchase.If you experience any issues or bugs, contact me and I will help resolve them.

5a:T7d8,

Turn any CMS collection into a polished fullscreen lightbox.

Open images, uploaded videos and FrameRate embeds with smooth navigation. Browse using swipe gestures, keyboard controls, on-screen arrows or an optional thumbnail strip.

Please note: Framer native Gallery fields are not currently supported.

When a video or FrameRate embed is added, it replaces the image as the main media for that item. The image remains visible as the thumbnail and static preview.

Features

Works with Framer CMS collections
Supports images and uploaded video files
Supports FrameRate iframe embeds
Swipe, keyboard and button navigation
Optional thumbnail strip
Captions and gallery titles
Customisable controls and styling
Lazy loading for improved performance
Static-renderer-safe video previews

How to use

Add the component Place it inside your CMS item or layout.

Connect your image Bind your CMS image field to the Image property.

Add optional media Connect an uploaded video or paste a FrameRate iframe code or embed URL into FrameRate Embed.

Add text Connect optional caption and gallery title fields.

Create a gallery Give related items the same Gallery ID to group them into one lightbox.

Customise Adjust the layout, navigation, thumbnails, colours, typography and controls from the properties panel.

50:["$","$L51",null,{"value":{"fallback":{"$inf$activity-creator-99d592eb-2b87-4aec-95b7-7e60558a7dff-all:/unified/creator/99d592eb-2b87-4aec-95b7-7e60558a7dff/activity/":[{"data":[{"id":"01a0be5f-433e-73fc-844d-4e02822360c3","type":"creator.followed","target":{"type":"creator","id":"173bd428-3517-474e-bf63-5f7c49dcb954","preview":"Raviteja Karrothu","previewJson":null,"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/308407/avatar-t6Z6aIGG1SYJlxzVImjQRFMqfIom3v.jpg","slug":"raviteja-karrothu","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"99d592eb-2b87-4aec-95b7-7e60558a7dff","name":"Riccardo Fala","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/37356/avatar-knHQz8HqXmxjQ5FGefV8YaPg8wEqsj.jpg","slug":"riccardo-fala","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-09-20T10:31:49.289Z","latestAt":"2026-09-20T10:31:49.289Z"},{"id":"01a0a6f4-e317-7118-a57b-dceb534d767c","type":"creator.followed","target":{"type":"creator","id":"7e4b2376-92d9-49df-8580-e3293af08a29","preview":"Michelle de Haas | Zo-e","previewJson":null,"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/7e4b2376-92d9-49df-8580-e3293af08a29/cl04sjas","slug":"zo-e","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"99d592eb-2b87-4aec-95b7-7e60558a7dff","name":"Riccardo Fala","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/37356/avatar-knHQz8HqXmxjQ5FGefV8YaPg8wEqsj.jpg","slug":"riccardo-fala","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-09-15T21:24:21.906Z","latestAt":"2026-09-15T21:24:21.906Z"},{"id":"01a07d22-99a5-714d-8cf5-4d813cf64bf2","type":"creator.followed","target":{"type":"creator","id":"c6d0aad4-c0dd-4029-861d-0cd6aaa6f3f4","preview":"Gustavo H. ","previewJson":null,"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/c6d0aad4-c0dd-4029-861d-0cd6aaa6f3f4/94zcb8k9","slug":"madebygustavoh","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"99d592eb-2b87-4aec-95b7-7e60558a7dff","name":"Riccardo Fala","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/37356/avatar-knHQz8HqXmxjQ5FGefV8YaPg8wEqsj.jpg","slug":"riccardo-fala","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-09-07T18:30:14.688Z","latestAt":"2026-09-07T18:30:14.688Z"},{"id":"01a04a33-97f0-74cd-b65e-4664a36de0c1","type":"creator.followed","target":{"type":"creator","id":"6f1fa339-e254-4bb5-a7b0-7ca6bdd8815f","preview":"Sabo Sugi","previewJson":null,"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/322027/avatar-gLNJKk2BH1oU6G2tRacFZWXlTUzSdJ.jpg","slug":"sabosugi","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"99d592eb-2b87-4aec-95b7-7e60558a7dff","name":"Riccardo Fala","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/37356/avatar-knHQz8HqXmxjQ5FGefV8YaPg8wEqsj.jpg","slug":"riccardo-fala","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-08-28T21:08:10.335Z","latestAt":"2026-08-28T21:08:10.335Z"},{"id":"01a02548-a45b-702a-b185-ef191734c72e","type":"component.created","target":{"type":"component","id":"AoFgBOECVhMfcozLNpf1","preview":"CMS Case Study Modal","previewJson":null,"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/99d592eb-2b87-4aec-95b7-7e60558a7dff/01a05ca0-4352-74ca-9cb3-13d2375ccdf1.png","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"99d592eb-2b87-4aec-95b7-7e60558a7dff","name":"Riccardo Fala","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/37356/avatar-knHQz8HqXmxjQ5FGefV8YaPg8wEqsj.jpg","slug":"riccardo-fala","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":"component","visibility":"public","startedAt":"2026-08-21T17:05:12.795Z","latestAt":"2026-08-21T17:05:12.795Z"},{"id":"019ffc2d-3e6b-747e-b6bf-4fbe72e8be75","type":"comment.reply","target":{"type":"post","id":"019dcf6f-56e9-70cf-904d-8fc537f41d6a","preview":"CMS Lightbox Gallery","previewJson":null,"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/j41KWo2ql37npmvr0JWt/cms-lightbox-Ho1QKd5k96dzcAaTK4tSQhNlcLdLDH","targetDeleted":false,"owned":true,"actions":{"postId":"019dcf6f-56e9-70cf-904d-8fc537f41d6a","like":{"count":14,"liked":false},"reply":{"parentCommentId":null},"repost":{"count":0,"reposted":false,"repostId":null}}},"context":{"type":"comment","id":"019ffc2d-3e4f-74da-b926-b25e8f885cc3","preview":"Thanks Julie!!!","previewJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"Thanks Julie!!!"}]}]},"thumbnail":null,"targetDeleted":false,"owned":true,"actions":{"postId":"019dcf6f-56e9-70cf-904d-8fc537f41d6a","like":{"count":0,"liked":false},"reply":{"parentCommentId":"019ffb7f-7306-73c0-a614-75f4aee8756a"},"repost":null}},"actors":[{"id":"99d592eb-2b87-4aec-95b7-7e60558a7dff","name":"Riccardo Fala","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/37356/avatar-knHQz8HqXmxjQ5FGefV8YaPg8wEqsj.jpg","slug":"riccardo-fala","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-08-13T17:30:51.371Z","latestAt":"2026-08-13T17:30:51.371Z"},{"id":"019ffc2c-ec3d-72ca-80c5-a5897910b032","type":"comment.liked","target":{"type":"comment","id":"019ffb7f-7306-73c0-a614-75f4aee8756a","preview":"This component has worked really great for our project. Riccardo has built out the options and been really helpful every time we had a question, so that we could get everything just right. Recommend!","previewJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"This component has worked really great for our project. Riccardo has built out the options and been really helpful every time we had a question, so that we could get everything just right. Recommend!"}]},{"type":"paragraph"}]},"thumbnail":null,"targetDeleted":false,"owned":false,"actions":{"postId":"019dcf6f-56e9-70cf-904d-8fc537f41d6a","like":{"count":1,"liked":false},"reply":{"parentCommentId":"019ffb7f-7306-73c0-a614-75f4aee8756a"},"repost":null}},"context":{"type":"post","id":"019dcf6f-56e9-70cf-904d-8fc537f41d6a","preview":"CMS Lightbox Gallery","previewJson":null,"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/j41KWo2ql37npmvr0JWt/cms-lightbox-Ho1QKd5k96dzcAaTK4tSQhNlcLdLDH","targetDeleted":false,"owned":true,"actions":{"postId":"019dcf6f-56e9-70cf-904d-8fc537f41d6a","like":{"count":14,"liked":false},"reply":{"parentCommentId":null},"repost":{"count":0,"reposted":false,"repostId":null}}},"actors":[{"id":"99d592eb-2b87-4aec-95b7-7e60558a7dff","name":"Riccardo Fala","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/37356/avatar-knHQz8HqXmxjQ5FGefV8YaPg8wEqsj.jpg","slug":"riccardo-fala","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-08-13T17:30:30.327Z","latestAt":"2026-08-13T17:30:30.327Z"},{"id":"019ffb85-c353-742d-9a41-2d10473db633","type":"component.created","target":{"type":"component","id":"PA5V6IJVd7BVO2nRwfHn","preview":"Modal Deep Links","previewJson":null,"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/99d592eb-2b87-4aec-95b7-7e60558a7dff/019ffb84-1bc9-713b-b659-067b73b74d7b.png","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"99d592eb-2b87-4aec-95b7-7e60558a7dff","name":"Riccardo Fala","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/37356/avatar-knHQz8HqXmxjQ5FGefV8YaPg8wEqsj.jpg","slug":"riccardo-fala","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":"component","visibility":"public","startedAt":"2026-08-13T14:27:55.347Z","latestAt":"2026-08-13T14:27:55.347Z"},{"id":"019ff14e-1581-73df-afe6-d2d96cb67a15","type":"creator.followed","target":{"type":"creator","id":"9387f0cc-b47f-4364-9402-a74231861534","preview":"Trueform","previewJson":null,"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/9387f0cc-b47f-4364-9402-a74231861534/kbhjgzt9","slug":"trueform","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"99d592eb-2b87-4aec-95b7-7e60558a7dff","name":"Riccardo Fala","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/37356/avatar-knHQz8HqXmxjQ5FGefV8YaPg8wEqsj.jpg","slug":"riccardo-fala","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-08-11T14:50:54.200Z","latestAt":"2026-08-11T14:50:54.200Z"},{"id":"019feba8-8934-7460-8f01-252d462786cd","type":"creator.followed","target":{"type":"creator","id":"b18fd996-12e7-44f9-a922-df2a616f2dda","preview":"Skarlo","previewJson":null,"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/b18fd996-12e7-44f9-a922-df2a616f2dda/cgpr3fx9","slug":"luca-skarlo","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"99d592eb-2b87-4aec-95b7-7e60558a7dff","name":"Riccardo Fala","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/37356/avatar-knHQz8HqXmxjQ5FGefV8YaPg8wEqsj.jpg","slug":"riccardo-fala","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-08-10T12:31:58.754Z","latestAt":"2026-08-10T12:31:58.754Z"},{"id":"019fc3aa-b5fd-70ab-b06e-b86eee22859f","type":"creator.followed","target":{"type":"creator","id":"b200b664-ca64-4bc3-93f1-403457d933dd","preview":"Dario Grigoletti","previewJson":null,"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/157756/avatar-Z6JpOzjtXXDc2o9DWh8zEM4aOEtqAs.jpg","slug":"grigoletti","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"99d592eb-2b87-4aec-95b7-7e60558a7dff","name":"Riccardo Fala","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/37356/avatar-knHQz8HqXmxjQ5FGefV8YaPg8wEqsj.jpg","slug":"riccardo-fala","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-08-02T18:09:32.571Z","latestAt":"2026-08-02T18:09:32.571Z"},{"id":"019fc22c-81f6-710d-a48d-04918a6fe11f","type":"post.liked","target":{"type":"post","id":"019fbf56-d54e-7588-8fed-1c7db1edf7d3","preview":"working on the the new project Foundry. \nThis page is scrolling smooth like butter.","previewJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"working on the the new project Foundry. "}]},{"type":"paragraph","content":[{"type":"text","text":"This page is scrolling smooth like butter. "}]}]},"thumbnail":"https://image.mux.com/01Xjb500hZnl9HY00jwtyal00f5mcNIR99Ls5idEXT02vx84/thumbnail.webp?time=2.067","targetDeleted":false,"owned":false,"actions":{"postId":"019fbf56-d54e-7588-8fed-1c7db1edf7d3","like":{"count":16,"liked":false},"reply":{"parentCommentId":null},"repost":{"count":1,"reposted":false,"repostId":null}}},"context":null,"actors":[{"id":"99d592eb-2b87-4aec-95b7-7e60558a7dff","name":"Riccardo Fala","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/37356/avatar-knHQz8HqXmxjQ5FGefV8YaPg8wEqsj.jpg","slug":"riccardo-fala","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-08-02T11:12:04.594Z","latestAt":"2026-08-02T11:12:04.594Z"},{"id":"019fba54-7572-7701-a46a-b6abd66ede1b","type":"template.liked","target":{"type":"template","id":"70501","preview":"Tangier Studio","previewJson":null,"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/d20b6df6-681d-4c9b-b43a-ce9e366db717/019fcd49-6199-74fa-b23b-6a44e601f5ad.png","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"99d592eb-2b87-4aec-95b7-7e60558a7dff","name":"Riccardo Fala","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/37356/avatar-knHQz8HqXmxjQ5FGefV8YaPg8wEqsj.jpg","slug":"riccardo-fala","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":"template","visibility":"public","startedAt":"2026-07-31T22:38:45.100Z","latestAt":"2026-07-31T22:38:45.100Z"},{"id":"019fba13-6338-7279-bc49-187628cacca7","type":"comment.reply","target":{"type":"post","id":"019dcf6f-56e9-70cf-904d-8fc537f41d6a","preview":"CMS Lightbox Gallery","previewJson":null,"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/j41KWo2ql37npmvr0JWt/cms-lightbox-Ho1QKd5k96dzcAaTK4tSQhNlcLdLDH","targetDeleted":false,"owned":true,"actions":{"postId":"019dcf6f-56e9-70cf-904d-8fc537f41d6a","like":{"count":14,"liked":false},"reply":{"parentCommentId":null},"repost":{"count":0,"reposted":false,"repostId":null}}},"context":{"type":"comment","id":"019fba13-631c-77ba-9ea8-4a3e4438f3e7","preview":"Hi Ankita, \nRight-click → Copy Link — don't click it):\nPaste it directly onto your Framer canvas. \nFramer will turn it into the actual component.\nPlace it inside your CMS item and connect your image field to the component.","previewJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"Hi Ankita, "}]},{"type":"paragraph","content":[{"type":"text","text":"Right-click → Copy Link — don't click it):"}]},{"type":"paragraph","content":[{"type":"text","text":"Paste it directly onto your Framer canvas. "}]},{"type":"paragraph","content":[{"type":"text","text":"Framer will turn it into the actual component."}]},{"type":"paragraph","content":[{"type":"text","text":"Place it inside your CMS item and connect your image field to the component."}]}]},"thumbnail":null,"targetDeleted":false,"owned":true,"actions":{"postId":"019dcf6f-56e9-70cf-904d-8fc537f41d6a","like":{"count":0,"liked":false},"reply":{"parentCommentId":"019fb9c3-8a87-7275-b973-3c6a4bf69fe9"},"repost":null}},"actors":[{"id":"99d592eb-2b87-4aec-95b7-7e60558a7dff","name":"Riccardo Fala","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/37356/avatar-knHQz8HqXmxjQ5FGefV8YaPg8wEqsj.jpg","slug":"riccardo-fala","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-07-31T21:27:40.600Z","latestAt":"2026-07-31T21:27:40.600Z"},{"id":"019faf32-ef1d-7638-8612-1a6970bbdff3","type":"creator.followed","target":{"type":"creator","id":"668eb6a0-d4fa-4cb9-8d7c-202e2d47a32f","preview":"Munzir Kareem","previewJson":null,"thumbnail":"https://framerusercontent.com/avatars/users/668eb6a0-d4fa-4cb9-8d7c-202e2d47a32f/yELwL06f0","slug":"munzirkareem","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"99d592eb-2b87-4aec-95b7-7e60558a7dff","name":"Riccardo Fala","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/37356/avatar-knHQz8HqXmxjQ5FGefV8YaPg8wEqsj.jpg","slug":"riccardo-fala","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-07-29T18:46:18.647Z","latestAt":"2026-07-29T18:46:18.647Z"},{"id":"019fad3f-fd74-722e-a674-5fbb47fec15a","type":"creator.followed","target":{"type":"creator","id":"145266b7-4a55-4a3b-80a1-ecffbd4346ee","preview":"Aathif Thajudeen","previewJson":null,"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1014411/avatar-3hhQ5xrvrHyPqcZW2PL4D8an7mFCGm.jpg","slug":"aathif-thajudeen","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"99d592eb-2b87-4aec-95b7-7e60558a7dff","name":"Riccardo Fala","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/37356/avatar-knHQz8HqXmxjQ5FGefV8YaPg8wEqsj.jpg","slug":"riccardo-fala","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-07-29T09:41:19.855Z","latestAt":"2026-07-29T09:41:19.855Z"},{"id":"019fa523-412a-717a-a908-4b624f6336e7","type":"post.liked","target":{"type":"post","id":"019edf0e-80d3-76bf-9863-279c9b4cbd09","preview":"Built this drifting animated gallery section for a museum website\nCrafted from scratch in Framer based on the client's reference, with a focus on smooth motion, depth, and an immersive browsing experience.\nWould love to hear your thoughts 🧠","previewJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"Built this drifting animated gallery section for a museum website"}]},{"type":"paragraph","content":[{"type":"text","text":"Crafted from scratch in Framer based on the client's reference, with a focus on smooth motion, depth, and an immersive browsing experience."}]},{"type":"paragraph","content":[{"type":"text","text":"Would love to hear your thoughts 🧠"}]}]},"thumbnail":"https://image.mux.com/THXuDxV01dmzF7FfFQB01T65ybGc1W00d0102tMDuqKsJdCs/thumbnail.webp?time=4.467","targetDeleted":false,"owned":false,"actions":{"postId":"019edf0e-80d3-76bf-9863-279c9b4cbd09","like":{"count":9,"liked":false},"reply":{"parentCommentId":null},"repost":{"count":0,"reposted":false,"repostId":null}}},"context":null,"actors":[{"id":"99d592eb-2b87-4aec-95b7-7e60558a7dff","name":"Riccardo Fala","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/37356/avatar-knHQz8HqXmxjQ5FGefV8YaPg8wEqsj.jpg","slug":"riccardo-fala","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-07-27T19:52:58.918Z","latestAt":"2026-07-27T19:52:58.918Z"},{"id":"019fa51c-c10a-71a8-86bf-b9e8ebbff097","type":"creator.followed","target":{"type":"creator","id":"a8b5d8f7-8054-4428-9d13-1ff170b5cad3","preview":"Jean","previewJson":null,"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/a8b5d8f7-8054-4428-9d13-1ff170b5cad3/qgfvh25r","slug":"jean","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"99d592eb-2b87-4aec-95b7-7e60558a7dff","name":"Riccardo Fala","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/37356/avatar-knHQz8HqXmxjQ5FGefV8YaPg8wEqsj.jpg","slug":"riccardo-fala","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-07-27T19:45:52.902Z","latestAt":"2026-07-27T19:45:52.902Z"},{"id":"019fa512-41fa-755b-8726-517f421ff404","type":"comment.liked","target":{"type":"comment","id":"019fa511-8815-703e-a76d-9f7b7d83ab80","preview":"great work bro","previewJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"great work bro"}]}]},"thumbnail":null,"targetDeleted":false,"owned":false,"actions":{"postId":"019fa50c-94e1-743e-83c9-437abf61b349","like":{"count":1,"liked":false},"reply":{"parentCommentId":"019fa511-8815-703e-a76d-9f7b7d83ab80"},"repost":null}},"context":{"type":"post","id":"019fa50c-94e1-743e-83c9-437abf61b349","preview":"A small animation I’ve been working on.\nThe paper plane now moves smoothly across the contact section 🚀, followed by the letters forming “CREATE VISION” in the footer.\nI love adding simple details that give a page more movement and character 😃","previewJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"A small animation I’ve been working on."}]},{"type":"paragraph","content":[{"type":"text","text":"The paper plane now moves smoothly across the contact section "},{"type":"emoji","attrs":{"name":"rocket","emoji":"🚀"}},{"type":"text","text":", followed by the letters forming “CREATE VISION” in the footer."}]},{"type":"paragraph","content":[{"type":"text","text":"I love adding simple details that give a page more movement and character "},{"type":"emoji","attrs":{"name":"smiley","emoji":"😃"}}]}]},"thumbnail":"https://image.mux.com/9TpaIsqtbli9DOCR3Zbx7xf01012TLVxbyb01RjFXDTJpI/thumbnail.webp?time=1.498","targetDeleted":false,"owned":true,"actions":{"postId":"019fa50c-94e1-743e-83c9-437abf61b349","like":{"count":8,"liked":false},"reply":{"parentCommentId":null},"repost":{"count":0,"reposted":false,"repostId":null}}},"actors":[{"id":"99d592eb-2b87-4aec-95b7-7e60558a7dff","name":"Riccardo Fala","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/37356/avatar-knHQz8HqXmxjQ5FGefV8YaPg8wEqsj.jpg","slug":"riccardo-fala","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-07-27T19:34:25.013Z","latestAt":"2026-07-27T19:34:25.013Z"},{"id":"019fa50e-456d-7579-be90-69668f618ec6","type":"post.liked","target":{"type":"post","id":"019fa50c-74d5-70ef-999a-9fd8eb4765a9","preview":"Agents is now free.\nhttps://framer.link/773f5HE","previewJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"Agents ","marks":[{"type":"bold"}]},{"type":"text","text":"is now free."}]},{"type":"paragraph","content":[{"type":"text","text":"https://framer.link/773f5HE","marks":[{"type":"link","attrs":{"rel":"noopener noreferrer nofollow","href":"https://framer.link/773f5HE","target":"_blank"}}]}]}]},"thumbnail":"https://image.mux.com/gMZI023CHmCT02LMeeNvMx01jzke01U5AEtpzkZNB02aNWvs/thumbnail.webp?time=2.383","targetDeleted":false,"owned":false,"actions":{"postId":"019fa50c-74d5-70ef-999a-9fd8eb4765a9","like":{"count":11,"liked":false},"reply":{"parentCommentId":null},"repost":{"count":0,"reposted":false,"repostId":null}}},"context":null,"actors":[{"id":"99d592eb-2b87-4aec-95b7-7e60558a7dff","name":"Riccardo Fala","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/37356/avatar-knHQz8HqXmxjQ5FGefV8YaPg8wEqsj.jpg","slug":"riccardo-fala","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-07-27T19:30:03.753Z","latestAt":"2026-07-27T19:30:03.753Z"}],"pagination":{"next":"MjAyNi0wNy0yN1QxOTozMDowMy43NTNafDAxOWZhNTBlLTQ1NmQtNzU3OS1iZTkwLTY5NjY4ZjYxOGVjNg","previous":null},"totalCount":"$undefined","feedSession":"$undefined"}],"$inf$posts:99d592eb-2b87-4aec-95b7-7e60558a7dff:/unified/posts/?creator=99d592eb-2b87-4aec-95b7-7e60558a7dff&with=reposts":[{"data":[{"id":"01a02548-a1fd-7536-940c-fe168354993d","title":null,"body":"

Your case studies don’t always need another page.

CMS Case Study Modal keeps visitors inside your portfolio grid while giving every project its own shareable deep link.

Add your projects through Framer CMS, choose a layout and let the component handle the modal, navigation and responsive behaviour.

","bodyJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"Your case studies don’t always need another page."}]},{"type":"paragraph","content":[{"type":"text","text":"CMS Case Study Modal keeps visitors inside your portfolio grid while giving every project its own shareable deep link."}]},{"type":"paragraph","content":[{"type":"text","text":"Add your projects through Framer CMS, choose a layout and let the component handle the modal, navigation and responsive behaviour."}]}]},"author":{"framerUserId":"99d592eb-2b87-4aec-95b7-7e60558a7dff","name":"Riccardo Fala","slug":"riccardo-fala","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/37356/avatar-knHQz8HqXmxjQ5FGefV8YaPg8wEqsj.jpg","followed":false,"followsYou":false},"media":[],"resources":[{"id":"AoFgBOECVhMfcozLNpf1","resolved":true,"title":"CMS Case Study Modal","body":"$52","bodyJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"A complete case-study modal for a CMS collection. Click a project to open it over your grid, with a unique URL you can share:"}]},{"type":"paragraph","content":[{"type":"text","text":"yoursite.com/#ledger-dashboard","marks":[{"type":"code"}]}]},{"type":"paragraph","content":[{"type":"text","text":"Deep linking is built in, so you don’t need a separate component."}]},{"type":"customHeading","content":[{"type":"text","text":"Setup"}],"attrs":{"level":2}},{"type":"paragraph","content":[{"type":"text","text":"Place one instance inside your collection item, bind its fields, and publish. Adding a project is as simple as adding a CMS item—there’s nothing to configure individually."}]},{"type":"customHeading","content":[{"type":"text","text":"Three layouts"}],"attrs":{"level":2}},{"type":"paragraph","content":[{"type":"text","text":"Choose Case Study, Photography, or Studio. Each layout arranges the sections differently. You can also define a custom order in one field:"}]},{"type":"paragraph","content":[{"type":"text","text":"ctx, i1, st1, p23, outcome","marks":[{"type":"code"}]}]},{"type":"paragraph","content":[{"type":"text","text":"Sections without content automatically disappear, so shorter projects never leave empty headings or unwanted gaps."}]},{"type":"customHeading","content":[{"type":"text","text":"The card"}],"attrs":{"level":2}},{"type":"paragraph","content":[{"type":"text","text":"The card begins in greyscale. On hover, colour sweeps across the image, rule, and title as one continuous gesture."}]},{"type":"paragraph","content":[{"type":"text","text":"Control the direction, duration, easing, edge softness, and resting opacity."}]},{"type":"customHeading","content":[{"type":"text","text":"Typography"}],"attrs":{"level":2}},{"type":"paragraph","content":[{"type":"text","text":"Six typography groups are included: Title, Subtitle, Label, Statement, Body, and Description."}]},{"type":"paragraph","content":[{"type":"text","text":"Each group provides controls for font, weight, size, letter spacing, line height, colour, and paragraph spacing. Type scales responsively on narrower screens and stops at a minimum size you define."}]},{"type":"customHeading","content":[{"type":"text","text":"Also handled"}],"attrs":{"level":2}},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Escape key, overlay click, close button, and browser Back"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"A single scroll container that responds on the first gesture"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Scroll-position restoration when the modal closes"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Focus management and keyboard focus trapping"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Mobile bottom-sheet layout with safe-area padding"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Optional parallax for selected images"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Automatic reduced-motion support"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Static Canvas and export rendering"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"CMS rich text, including lists, headings, links, bold, and italics"}]}]}]},{"type":"customHeading","content":[{"type":"text","text":"Good to know"}],"attrs":{"level":2}},{"type":"paragraph","content":[{"type":"text","text":"Content is supplied through CMS-bound component properties rather than designed layers. This allows every collection item to populate its own modal without manually wiring each project."}]},{"type":"paragraph","content":[{"type":"text","text":"Modal content is not intended to replace an indexable CMS project page. If per-project SEO is important, use dedicated CMS pages instead."}]},{"type":"paragraph"}]},"introduction":"Case studies with shareable URLs","slug":"cms-case-study-modal","author":{"framerUserId":"99d592eb-2b87-4aec-95b7-7e60558a7dff","name":"Riccardo Fala","slug":"riccardo-fala","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/37356/avatar-knHQz8HqXmxjQ5FGefV8YaPg8wEqsj.jpg","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/99d592eb-2b87-4aec-95b7-7e60558a7dff/01a05ca0-4352-74ca-9cb3-13d2375ccdf1.png","metadata":{"tint":{"h":0,"s":0,"l":16},"width":1536,"height":1024}}],"post":null,"createdAt":"2026-08-21T17:05:11.503Z","updatedAt":"2026-09-01T11:02:18.163Z","publishedAt":"2026-08-21T17:05:11.499Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":null,"previewUrl":"https://cms-case-study-modal.framer.website/","price":"19","paymentUrl":"https://rfstudio7.gumroad.com/l/CMSCaseStudyModal","workshop":false,"categories":[{"id":"7677fa83-43ce-41a2-a3fe-db438ec0fd33","name":"Interactive","slug":"interactive"}],"lastSaveId":"vSkLSQyNFa8LzRrL1aEW","tags":[]}}],"contests":[],"categories":[],"tags":[],"likes":{"count":1,"liked":false},"comments":{"count":0},"reposts":{"count":0,"reposted":false,"repostId":null},"version":3,"edited":true,"editedAt":"2026-09-01T11:02:19.032Z","createdAt":"2026-08-21T17:05:12.189Z","updatedAt":"2026-09-01T11:02:19.032Z"},{"id":"019ffb85-c13e-76ac-8219-698920ce31a3","title":null,"body":"

Every modal gets its own URL address 😃

","bodyJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"Every modal gets its own URL address "},{"type":"emoji","attrs":{"name":"smiley","emoji":"😃"}},{"type":"text","text":" "}]}]},"author":{"framerUserId":"99d592eb-2b87-4aec-95b7-7e60558a7dff","name":"Riccardo Fala","slug":"riccardo-fala","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/37356/avatar-knHQz8HqXmxjQ5FGefV8YaPg8wEqsj.jpg","followed":false,"followsYou":false},"media":[],"resources":[{"id":"PA5V6IJVd7BVO2nRwfHn","resolved":true,"title":"Modal Deep Links","body":"$53","bodyJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"Case studies inside modals don’t normally have individual URLs. When someone asks to see a project, you can only send your homepage and tell them where to click."}]},{"type":"paragraph","content":[{"type":"text","text":"Modal Deep Links gives every project a shareable address:"}]},{"type":"paragraph","content":[{"type":"text","text":"yoursite.com/#coastal-rebrand","marks":[{"type":"code"}]}]},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Open a project and the URL updates"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Share the link and its modal opens automatically"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Browser Back and Forward stay synchronized"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Escape and your existing close button are detected after closing"}]}]}]},{"type":"customHeading","content":[{"type":"text","text":"Setup"}],"attrs":{"level":2}},{"type":"paragraph","content":[{"type":"text","text":"Place one instance anywhere on the page."}]},{"type":"paragraph","content":[{"type":"text","text":"For reliable CMS URLs:"}]},{"type":"orderedList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Add a text layer inside each project card"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Bind it to the CMS "},{"type":"text","text":"Slug","marks":[{"type":"bold"}]},{"type":"text","text":" field"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Name it "},{"type":"text","text":"ProjectSlug","marks":[{"type":"code"}]}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Set it to "},{"type":"text","text":"1 × 1","marks":[{"type":"code"}]},{"type":"text","text":" and "},{"type":"text","text":"0%","marks":[{"type":"code"}]},{"type":"text","text":" opacity"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Don’t enable "},{"type":"text","text":"Hidden","marks":[{"type":"bold"}]}]}]}],"attrs":{"type":null,"start":1}},{"type":"paragraph","content":[{"type":"text","text":"Your project card and modal interaction should already work normally. This component adds URL synchronization; it doesn’t create the modal."}]},{"type":"customHeading","content":[{"type":"text","text":"Controls"}],"attrs":{"level":2}},{"type":"paragraph","content":[{"type":"text","text":"Slug Layer","marks":[{"type":"bold"}]},{"type":"text","text":" — Layer bound to your CMS Slug field."}]},{"type":"paragraph","content":[{"type":"text","text":"Title Layer","marks":[{"type":"bold"}]},{"type":"text","text":" — Optional fallback for identifying projects by title."}]},{"type":"paragraph","content":[{"type":"text","text":"Close Text","marks":[{"type":"bold"}]},{"type":"text","text":" — Exact text used by your modal’s close control."}]},{"type":"paragraph","content":[{"type":"text","text":"Closed URL","marks":[{"type":"bold"}]},{"type":"text","text":" — Hash displayed after closing. Defaults to "},{"type":"text","text":"#projects","marks":[{"type":"code"}]},{"type":"text","text":"."}]},{"type":"paragraph","content":[{"type":"text","text":"Ignore","marks":[{"type":"bold"}]},{"type":"text","text":" — Titles or slugs that shouldn’t receive links, such as Coming Soon cards."}]},{"type":"customHeading","content":[{"type":"text","text":"Automatic fallback"}],"attrs":{"level":2}},{"type":"paragraph","content":[{"type":"text","text":"Without a slug layer, the component attempts to identify large linked image cards and creates URLs from their headings. A CMS slug layer is recommended because its URLs remain stable when titles change."}]},{"type":"customHeading","content":[{"type":"text","text":"Good to know"}],"attrs":{"level":2}},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Shows only a small marker on the Framer Canvas"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Renders no visible interface on the published site"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Works with existing Framer overlays and modal interactions"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Designed for one-page portfolios with modal case studies"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Dedicated CMS pages are recommended when per-project SEO matters"}]}]}]}]},"introduction":"Send a link to any case study","slug":"modal-deep-links","author":{"framerUserId":"99d592eb-2b87-4aec-95b7-7e60558a7dff","name":"Riccardo Fala","slug":"riccardo-fala","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/37356/avatar-knHQz8HqXmxjQ5FGefV8YaPg8wEqsj.jpg","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/99d592eb-2b87-4aec-95b7-7e60558a7dff/019ffb84-1bc9-713b-b659-067b73b74d7b.png","metadata":{"tint":{"h":204,"s":85,"l":53},"width":1600,"height":1200}}],"post":null,"createdAt":"2026-08-13T14:27:54.155Z","updatedAt":"2026-08-22T08:26:35.294Z","publishedAt":"2026-08-13T14:27:54.151Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":"https://hy.chujiqiqi.com/m/Project-Deep-Links-24t6RE.js@Mz3pquc41xvTrH3hbH4r","previewUrl":"https://modal-deep-links.framer.website/","price":null,"paymentUrl":null,"workshop":false,"categories":[{"id":"7677fa83-43ce-41a2-a3fe-db438ec0fd33","name":"Interactive","slug":"interactive"}],"lastSaveId":"Mz3pquc41xvTrH3hbH4r","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-08-13T14:27:54.814Z","updatedAt":"2026-08-13T14:27:54.814Z"},{"id":"019fa50c-94e1-743e-83c9-437abf61b349","title":null,"body":"

A small animation I’ve been working on.

The paper plane now moves smoothly across the contact section 🚀, followed by the letters forming “CREATE VISION” in the footer.

I love adding simple details that give a page more movement and character 😃

","bodyJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"A small animation I’ve been working on."}]},{"type":"paragraph","content":[{"type":"text","text":"The paper plane now moves smoothly across the contact section "},{"type":"emoji","attrs":{"name":"rocket","emoji":"🚀"}},{"type":"text","text":", followed by the letters forming “CREATE VISION” in the footer."}]},{"type":"paragraph","content":[{"type":"text","text":"I love adding simple details that give a page more movement and character "},{"type":"emoji","attrs":{"name":"smiley","emoji":"😃"}}]}]},"author":{"framerUserId":"99d592eb-2b87-4aec-95b7-7e60558a7dff","name":"Riccardo Fala","slug":"riccardo-fala","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/37356/avatar-knHQz8HqXmxjQ5FGefV8YaPg8wEqsj.jpg","followed":false,"followsYou":false},"media":[{"type":"video","url":"https://stream.mux.com/9TpaIsqtbli9DOCR3Zbx7xf01012TLVxbyb01RjFXDTJpI.m3u8","metadata":{"posterUrl":"https://image.mux.com/9TpaIsqtbli9DOCR3Zbx7xf01012TLVxbyb01RjFXDTJpI/thumbnail.webp?time=1.498","aspectRatio":"1199:765","duration":13.85}}],"resources":[],"contests":[],"categories":[{"id":"cf35162f-8406-49a9-a023-4c58024795ee","name":"General","slug":"general","description":"General","metaTitle":"General","metaDescription":"General"}],"tags":[],"likes":{"count":8,"liked":false},"comments":{"count":1},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2026-07-27T19:28:13.029Z","updatedAt":"2026-07-27T19:28:13.029Z"},{"id":"019f86e2-dc7f-705d-ab17-ecb429c6aa0a","title":null,"body":"

Just wrapped up this portfolio for a London-based photographer.

Built around a simple editorial layout, subtle interactions and a CMS-powered archive designed to let the photography take centre stage.

Feedback always welcome! 🙌

","bodyJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"Just wrapped up this portfolio for a London-based photographer."}]},{"type":"paragraph","content":[{"type":"text","text":"Built around a simple editorial layout, subtle interactions and a CMS-powered archive designed to let the photography take centre stage."}]},{"type":"paragraph","content":[{"type":"text","text":"Feedback always welcome! "},{"type":"emoji","attrs":{"name":"raised_hands","emoji":"🙌"}}]}]},"author":{"framerUserId":"99d592eb-2b87-4aec-95b7-7e60558a7dff","name":"Riccardo Fala","slug":"riccardo-fala","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/37356/avatar-knHQz8HqXmxjQ5FGefV8YaPg8wEqsj.jpg","followed":false,"followsYou":false},"media":[],"resources":[{"id":"16738","resolved":true,"title":"Mark Cocksedge","body":"

Designed for London-based photographer Mark Cocksedge, this portfolio puts the work first through a restrained editorial layout, full-bleed imagery and subtle motion.

A scroll-driven hero introduces the site before giving way to a CMS-powered archive that showcases decades of portraiture, campaigns and design projects. Light and dark modes, responsive layouts and carefully considered interactions keep the focus on the photography.

The gallery experience is powered by my CMS Lightbox Gallery component, allowing images to open in a fullscreen, CMS-driven lightbox with smooth navigation.

","bodyJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"Designed for London-based photographer Mark Cocksedge, this portfolio puts the work first through a restrained editorial layout, full-bleed imagery and subtle motion.","marks":[{"type":"bold"}]}]},{"type":"paragraph","content":[{"type":"text","text":"A scroll-driven hero introduces the site before giving way to a CMS-powered archive that showcases decades of portraiture, campaigns and design projects. Light and dark modes, responsive layouts and carefully considered interactions keep the focus on the photography."}]},{"type":"paragraph","content":[{"type":"text","text":"The gallery experience is powered by my CMS Lightbox Gallery component, allowing images to open in a fullscreen, CMS-driven lightbox with smooth navigation.","marks":[{"type":"bold"}]}]}]},"introduction":"","slug":"mark-cocksedge","author":{"framerUserId":"99d592eb-2b87-4aec-95b7-7e60558a7dff","name":"Riccardo Fala","slug":"riccardo-fala","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/37356/avatar-knHQz8HqXmxjQ5FGefV8YaPg8wEqsj.jpg","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/99d592eb-2b87-4aec-95b7-7e60558a7dff/019f86e0-bac4-778b-b99f-e2b443398c62.png","metadata":{"tint":{"h":0,"s":0,"l":58},"width":1600,"height":1200}}],"post":null,"createdAt":"2026-07-21T22:54:01.863Z","updatedAt":"2026-07-21T22:54:01.863Z","publishedAt":"2026-07-21T22:54:01.859Z","featuredAt":null,"approvedAt":null,"type":"site","attributes":{"url":"https://www.markcocksedge.co.uk/","categories":[{"id":"6a730e3d-bdf2-42a2-ab42-eee5ef39b694","name":"Portfolio","slug":"portfolio"},{"id":"4e292c6b-a094-4031-be7b-7affa4349187","name":"Agency","slug":"agency"}],"mainCategory":null,"tags":[]}}],"contests":[],"categories":[],"tags":[],"likes":{"count":2,"liked":false},"comments":{"count":0},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2026-07-21T22:54:02.367Z","updatedAt":"2026-07-21T22:54:02.367Z"},{"id":"019f615b-29c3-7309-8049-ecc472792c49","title":null,"body":"

Sharing my CMS Lightbox Gallery component for Framer.

I just recently updated and it connects directly to CMS collections and supports images, videos, captions, gallery titles, thumbnails, swipe gestures, keyboard navigation and customisable controls.

It can be useful for portfolios, photography sites, case studies or any CMS project that needs a more flexible fullscreen gallery.

I’d love to hear any feedback. If you’d like to try it, send me a message and I can share a 20% discount link. Also let me know if there are any additional fields or options that would make the component more useful. 😊

Available on the Framer Marketplace https://framer.link/h0dh9gP

","bodyJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"Sharing my CMS Lightbox Gallery component for Framer."}]},{"type":"paragraph","content":[{"type":"text","text":"I just recently updated and it connects directly to CMS collections and supports images, videos, captions, gallery titles, thumbnails, swipe gestures, keyboard navigation and customisable controls."}]},{"type":"paragraph","content":[{"type":"text","text":"It can be useful for portfolios, photography sites, case studies or any CMS project that needs a more flexible fullscreen gallery."}]},{"type":"paragraph","content":[{"type":"text","text":"I’d love to hear any feedback. If you’d like to try it, send me a message and I can share a 20% discount link. Also let me know if there are any additional fields or options that would make the component more useful. "},{"type":"emoji","attrs":{"name":"blush","emoji":"😊"}}]},{"type":"paragraph","content":[{"type":"text","text":"Available on the Framer Marketplace "},{"type":"text","text":"https://framer.link/h0dh9gP","marks":[{"type":"link","attrs":{"rel":"noopener noreferrer nofollow","href":"https://framer.link/h0dh9gP","target":"_blank"}}]}]}]},"author":{"framerUserId":"99d592eb-2b87-4aec-95b7-7e60558a7dff","name":"Riccardo Fala","slug":"riccardo-fala","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/37356/avatar-knHQz8HqXmxjQ5FGefV8YaPg8wEqsj.jpg","followed":false,"followsYou":false},"media":[{"type":"video","url":"https://stream.mux.com/pQz00PctlMCu3D02P01mE72JI02e6YmFMDZy9l5OZUZY938.m3u8","metadata":{"posterUrl":"https://image.mux.com/pQz00PctlMCu3D02P01mE72JI02e6YmFMDZy9l5OZUZY938/thumbnail.webp?time=12.195","aspectRatio":"16:9","duration":60.171822}}],"resources":[],"contests":[],"categories":[{"id":"cf35162f-8406-49a9-a023-4c58024795ee","name":"General","slug":"general","description":"General","metaTitle":"General","metaDescription":"General"}],"tags":[],"likes":{"count":5,"liked":false},"comments":{"count":2},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2026-07-14T15:59:52.271Z","updatedAt":"2026-07-14T15:59:52.271Z"},{"id":"019f42a6-edfa-74cc-9add-7d74ff6dc3c5","title":null,"body":"

Been building a portfolio website in Framer for a London-based visual artist over the last few days.

✨Every preview sparks another idea, so I keep tweaking and refining the animations.

Working with such inspiring artwork and collage compositions has made this a really fun creative process.

Here's a quick look at the work in progress. More soon! 🚀

","bodyJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"Been building a portfolio website in Framer for a London-based visual artist over the last few days. "}]},{"type":"paragraph","content":[{"type":"emoji","attrs":{"name":"sparkles","emoji":"✨"}},{"type":"text","text":"Every preview sparks another idea, so I keep tweaking and refining the animations. "}]},{"type":"paragraph","content":[{"type":"text","text":"Working with such inspiring artwork and collage compositions has made this a really fun creative process."}]},{"type":"paragraph","content":[{"type":"text","text":"Here's a quick look at the work in progress. More soon! "},{"type":"emoji","attrs":{"name":"rocket","emoji":"🚀"}}]}]},"author":{"framerUserId":"99d592eb-2b87-4aec-95b7-7e60558a7dff","name":"Riccardo Fala","slug":"riccardo-fala","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/37356/avatar-knHQz8HqXmxjQ5FGefV8YaPg8wEqsj.jpg","followed":false,"followsYou":false},"media":[{"type":"video","url":"https://stream.mux.com/VR0224ipGVxKv5rM6NCOJBJI6pQYWsIPM8GqZY6De9Aw.m3u8","metadata":{"posterUrl":"https://image.mux.com/VR0224ipGVxKv5rM6NCOJBJI6pQYWsIPM8GqZY6De9Aw/thumbnail.webp?time=2.607","aspectRatio":"1459:950","duration":14.842567}}],"resources":[],"contests":[],"categories":[{"id":"cf35162f-8406-49a9-a023-4c58024795ee","name":"General","slug":"general","description":"General","metaTitle":"General","metaDescription":"General"}],"tags":[],"likes":{"count":6,"liked":false},"comments":{"count":3},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2026-07-08T16:54:23.998Z","updatedAt":"2026-07-08T16:54:23.998Z"},{"id":"019f36b0-a23d-756b-815a-0b867fff8d37","title":null,"body":"

Just a quick update on my Lightbox Pro component.

I got my first 1⭐ review saying it "doesn't work" 😅.

I tested it again and everything is working as expected, so I've reached out to the customer to help figure out what went wrong.

If you've been thinking about trying it, I'd love to hear your feedback. I'm always improving the component and adding new features.

Thanks to everyone who's supported it so far! 🙌

","bodyJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"Just a quick update on my "},{"type":"text","text":"Lightbox Pro ","marks":[{"type":"bold"}]},{"type":"text","text":"component."}]},{"type":"paragraph","content":[{"type":"text","text":"I got my first 1"},{"type":"emoji","attrs":{"name":"star","emoji":"⭐"}},{"type":"text","text":" review saying it \"doesn't work\" "},{"type":"emoji","attrs":{"name":"sweat_smile","emoji":"😅"}},{"type":"text","text":"."}]},{"type":"paragraph","content":[{"type":"text","text":"I tested it again and everything is working as expected, so I've reached out to the customer to help figure out what went wrong."}]},{"type":"paragraph","content":[{"type":"text","text":"If you've been thinking about trying it, I'd love to hear your feedback. I'm always improving the component and adding new features."}]},{"type":"paragraph","content":[{"type":"text","text":"Thanks to everyone who's supported it so far! "},{"type":"emoji","attrs":{"name":"raised_hands","emoji":"🙌"}}]}]},"author":{"framerUserId":"99d592eb-2b87-4aec-95b7-7e60558a7dff","name":"Riccardo Fala","slug":"riccardo-fala","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/37356/avatar-knHQz8HqXmxjQ5FGefV8YaPg8wEqsj.jpg","followed":false,"followsYou":false},"media":[{"type":"video","url":"https://stream.mux.com/sdRTkzKPO02rm2lhyZX31kjyX01qgo7br3PWwYqTXMA01Y.m3u8","metadata":{"posterUrl":"https://image.mux.com/sdRTkzKPO02rm2lhyZX31kjyX01qgo7br3PWwYqTXMA01Y/thumbnail.webp?time=2.225","aspectRatio":"16:9","duration":31.454933}}],"resources":[],"contests":[],"categories":[{"id":"cf35162f-8406-49a9-a023-4c58024795ee","name":"General","slug":"general","description":"General","metaTitle":"General","metaDescription":"General"}],"tags":[],"likes":{"count":5,"liked":false},"comments":{"count":0},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2026-07-06T09:09:33.384Z","updatedAt":"2026-07-06T09:09:33.384Z"},{"id":"019ed641-e1a1-77fc-b39d-501d9eafeefa","title":null,"body":"

Pixel Tennis is a Wimbledon-inspired retro tennis game built entirely in Framer. Framer Agents generated and refined much of the gameplay, animations, and interactions.

Give it a try and see how long you can keep the rally alive. 🎾

","bodyJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"Pixel Tennis is a Wimbledon-inspired retro tennis game built entirely in Framer. Framer Agents generated and refined much of the gameplay, animations, and interactions."}]},{"type":"paragraph","content":[{"type":"text","text":"Give it a try and see how long you can keep the rally alive. "},{"type":"emoji","attrs":{"name":"tennis","emoji":"🎾"}}]}]},"author":{"framerUserId":"99d592eb-2b87-4aec-95b7-7e60558a7dff","name":"Riccardo Fala","slug":"riccardo-fala","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/37356/avatar-knHQz8HqXmxjQ5FGefV8YaPg8wEqsj.jpg","followed":false,"followsYou":false},"media":[],"resources":[],"contests":[{"id":"019ed641-e1a1-77fc-b39d-57dd8596ea12","contestId":"agents-hackathon","author":{"framerUserId":"99d592eb-2b87-4aec-95b7-7e60558a7dff","name":"Riccardo Fala","slug":"riccardo-fala","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/37356/avatar-knHQz8HqXmxjQ5FGefV8YaPg8wEqsj.jpg"},"title":"Pixel Tennis","body":"$54","bodyJson":{"type":"doc","content":[{"type":"customHeading","content":[{"type":"text","text":"Why I Built It"}],"attrs":{"level":2}},{"type":"paragraph","content":[{"type":"text","text":"With The Championships at Wimbledon just around the corner, I was inspired to build something for fellow tennis fans: a retro tennis game where players step onto the court and keep the rally alive."}]},{"type":"customHeading","content":[{"type":"text","text":"The Challenge"}],"attrs":{"level":2}},{"type":"paragraph","content":[{"type":"text","text":"I wanted to create something interactive, and the challenge was bringing together gameplay, animations, AI-generated code, and a Wimbledon-inspired experience into a single Framer project. Framer Agents helped generate and refine much of the game throughout the build."}]},{"type":"customHeading","content":[{"type":"text","text":"Framer Agents"}],"attrs":{"level":2}},{"type":"paragraph","content":[{"type":"text","text":"Framer Agents played a big role in building the game. They generated, refined, and debugged most of the gameplay, animations, and interactions, making it possible to turn the idea into a fully playable experience during the hackathon."}]},{"type":"customHeading","content":[{"type":"text","text":"Features:"}],"attrs":{"level":2}},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Retro pixel-art tennis gameplay"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Wimbledon-inspired design"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Interactive animations"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Built entirely in Framer with Framer Agents"}]}]}]},{"type":"customHeading","content":[{"type":"text","text":"Play Now"}],"attrs":{"level":2}},{"type":"paragraph","content":[{"type":"text","text":"See how long you can keep the rally alive."}]}]},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/99d592eb-2b87-4aec-95b7-7e60558a7dff/qvkh13cv","metadata":{"tint":{"h":90,"s":58,"l":40},"width":1600,"height":1200}}],"post":null,"data":{"previewUrl":"https://pixeltennis.framer.website/"},"winner":false,"createdAt":"2026-06-17T15:45:02.417Z","updatedAt":"2026-06-17T15:45:02.417Z"}],"categories":[],"tags":[],"likes":{"count":11,"liked":false},"comments":{"count":0},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2026-06-17T15:45:02.377Z","updatedAt":"2026-06-17T15:45:02.377Z"},{"id":"019e6dd3-2bfb-77a8-9e38-76a7f78730cf","title":null,"body":null,"bodyJson":null,"author":{"framerUserId":"99d592eb-2b87-4aec-95b7-7e60558a7dff","name":"Riccardo Fala","slug":"riccardo-fala","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/37356/avatar-knHQz8HqXmxjQ5FGefV8YaPg8wEqsj.jpg","followed":false,"followsYou":false},"media":[],"resources":[{"id":"x7OK5GNUlFRyJGFGG3R5","resolved":true,"title":"Password Download","body":"$55","bodyJson":null,"introduction":"Password gated file downloads","slug":"password-download","author":{"framerUserId":"99d592eb-2b87-4aec-95b7-7e60558a7dff","name":"Riccardo Fala","slug":"riccardo-fala","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/37356/avatar-knHQz8HqXmxjQ5FGefV8YaPg8wEqsj.jpg","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/x7OK5GNUlFRyJGFGG3R5/password-download-X4Zqxe0cer1ODSYs1taIhQxWXJOOmw","metadata":{"tint":{"h":0,"s":0,"l":3},"width":1600,"height":1200}}],"post":null,"createdAt":"2026-05-15T11:11:35.341Z","updatedAt":"2026-05-30T17:05:50.121Z","publishedAt":"2026-05-28T09:03:36.443Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":null,"previewUrl":"https://password-download.framer.website/","price":"9","paymentUrl":"https://gumroad.com/checkout?product=mtblsq&quantity=1&referrer=https%3A%2F%2Fgumroad.com%2F","workshop":false,"categories":[{"id":"bc230830-1d89-456e-96fe-6a9de5a801d0","name":"Forms","slug":"forms"}],"lastSaveId":"5rs31pi81BLvyablYLZw","tags":[]}}],"contests":[],"categories":[],"tags":[],"likes":{"count":3,"liked":false},"comments":{"count":0},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2026-05-28T09:03:36.443Z","updatedAt":"2026-05-28T09:03:36.443Z"},{"id":"019e64d0-f863-7188-893d-bf75fe5ec136","title":null,"body":null,"bodyJson":null,"author":{"framerUserId":"99d592eb-2b87-4aec-95b7-7e60558a7dff","name":"Riccardo Fala","slug":"riccardo-fala","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/37356/avatar-knHQz8HqXmxjQ5FGefV8YaPg8wEqsj.jpg","followed":false,"followsYou":false},"media":[],"resources":[{"id":"jzjqV3HAeFeGJcUBYjFD","resolved":true,"title":"CMS Download Card","body":"$56","bodyJson":null,"introduction":"CMS-powered downloadable file cards","slug":"cms-download-card","author":{"framerUserId":"99d592eb-2b87-4aec-95b7-7e60558a7dff","name":"Riccardo Fala","slug":"riccardo-fala","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/37356/avatar-knHQz8HqXmxjQ5FGefV8YaPg8wEqsj.jpg","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/jzjqV3HAeFeGJcUBYjFD/cms-download-card-PKuculK4gSG040ihxHodFpYkQFMyah","metadata":{"tint":{"h":0,"s":0,"l":57},"width":1600,"height":1200}}],"post":null,"createdAt":"2026-05-13T20:00:07.330Z","updatedAt":"2026-06-08T07:52:46.890Z","publishedAt":"2026-05-26T15:04:37.219Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":null,"previewUrl":"https://cms-download-card.framer.website/","price":"8","paymentUrl":"https://gumroad.com/checkout?product=trpwm&quantity=1&referrer=https%3A%2F%2Fgumroad.com%2F","workshop":false,"categories":[{"id":"c3e183d1-597a-4479-8a6f-244ae3c96f40","name":"Cards","slug":"cards"}],"lastSaveId":"DOlV4GsOsUFICBdTIs80","tags":[]}}],"contests":[],"categories":[],"tags":[],"likes":{"count":2,"liked":false},"comments":{"count":0},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2026-05-26T15:04:37.219Z","updatedAt":"2026-05-26T15:04:37.219Z"},{"id":"019dcf6f-8701-731f-92da-e5ee0792a94d","title":null,"body":null,"bodyJson":null,"author":{"framerUserId":"99d592eb-2b87-4aec-95b7-7e60558a7dff","name":"Riccardo Fala","slug":"riccardo-fala","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/37356/avatar-knHQz8HqXmxjQ5FGefV8YaPg8wEqsj.jpg","followed":false,"followsYou":false},"media":[],"resources":[{"id":"zRuYuekx5rorSIKQVILR","resolved":true,"title":"Video Preview ","body":"$57","bodyJson":null,"introduction":"Instant hover video previews","slug":"video-preview-card","author":{"framerUserId":"99d592eb-2b87-4aec-95b7-7e60558a7dff","name":"Riccardo Fala","slug":"riccardo-fala","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/37356/avatar-knHQz8HqXmxjQ5FGefV8YaPg8wEqsj.jpg","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/zRuYuekx5rorSIKQVILR/video-preview-card-8eAZQoyXTf8rQ1L5xrYPoSjdWUeEVE","metadata":{"tint":{"h":300,"s":31,"l":20},"width":1600,"height":1200}}],"post":null,"createdAt":"2026-04-27T11:03:37.390Z","updatedAt":"2026-07-24T06:42:26.269Z","publishedAt":"2026-04-27T14:54:46.017Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":null,"previewUrl":"https://video-preview.framer.website","price":"9","paymentUrl":"https://rfstudio7.gumroad.com/l/video-preview?wanted=true","workshop":false,"categories":[{"id":"66bb31f7-cddf-4a3e-8604-95b3467aecc2","name":"Galleries","slug":"galleries"}],"lastSaveId":"uiA7YuH17M03ThSPyr9F","tags":[]}}],"contests":[],"categories":[],"tags":[],"likes":{"count":3,"liked":false},"comments":{"count":0},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2026-04-27T14:54:46.017Z","updatedAt":"2026-04-27T14:54:46.017Z"},{"id":"019dcf6f-78d0-7aa6-85b2-30668b1c7003","title":null,"body":null,"bodyJson":null,"author":{"framerUserId":"99d592eb-2b87-4aec-95b7-7e60558a7dff","name":"Riccardo Fala","slug":"riccardo-fala","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/37356/avatar-knHQz8HqXmxjQ5FGefV8YaPg8wEqsj.jpg","followed":false,"followsYou":false},"media":[],"resources":[{"id":"xYDoOtB0Ux4mdYL12x8u","resolved":true,"title":"Lightbox Lite","body":"$58","bodyJson":null,"introduction":"Transform Framer's native Lightbox","slug":"lightboxlite","author":{"framerUserId":"99d592eb-2b87-4aec-95b7-7e60558a7dff","name":"Riccardo Fala","slug":"riccardo-fala","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/37356/avatar-knHQz8HqXmxjQ5FGefV8YaPg8wEqsj.jpg","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/xYDoOtB0Ux4mdYL12x8u/lightboxlite-ByOe5ZGThFyjGfgJrKejDvmgseB4l2","metadata":{"tint":{"h":0,"s":0,"l":57},"width":1600,"height":1200}}],"post":null,"createdAt":"2026-04-27T11:17:37.808Z","updatedAt":"2026-04-29T10:16:56.868Z","publishedAt":"2026-04-27T14:54:42.384Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":"https://hy.chujiqiqi.com/m/LightboxLite-YhsqZx.js@l4l0OZDTHyIj4xkHTEb0","previewUrl":"https://lightbox-lite.framer.website/","price":null,"paymentUrl":null,"workshop":false,"categories":[{"id":"7677fa83-43ce-41a2-a3fe-db438ec0fd33","name":"Interactive","slug":"interactive"}],"lastSaveId":"l4l0OZDTHyIj4xkHTEb0","tags":[]}}],"contests":[],"categories":[],"tags":[],"likes":{"count":10,"liked":false},"comments":{"count":0},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2026-04-27T14:54:42.384Z","updatedAt":"2026-04-27T14:54:42.384Z"},{"id":"019dcf6f-6bd4-711d-81e3-e58fdbd1b1c6","title":null,"body":"

Just a quick update on Lightbox Pro.

Woke up to my first 1⭐ review saying it "doesn't work" 😅. I tested it again and everything is working as expected, so I've reached out to the customer to help figure out what went wrong.

If you've been thinking about trying it, I'd love to hear your feedback. I'm always improving the component and adding new features.

Thanks to everyone who's supported it so far! 🙌

","bodyJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"Just a quick update on "},{"type":"text","text":"Lightbox Pro","marks":[{"type":"bold"}]},{"type":"text","text":"."}]},{"type":"paragraph","content":[{"type":"text","text":"Woke up to my first 1"},{"type":"emoji","attrs":{"name":"star","emoji":"⭐"}},{"type":"text","text":" review saying it \"doesn't work\" "},{"type":"emoji","attrs":{"name":"sweat_smile","emoji":"😅"}},{"type":"text","text":". I tested it again and everything is working as expected, so I've reached out to the customer to help figure out what went wrong."}]},{"type":"paragraph","content":[{"type":"text","text":"If you've been thinking about trying it, I'd love to hear your feedback. I'm always improving the component and adding new features."}]},{"type":"paragraph","content":[{"type":"text","text":"Thanks to everyone who's supported it so far! "},{"type":"emoji","attrs":{"name":"raised_hands","emoji":"🙌"}}]}]},"author":{"framerUserId":"99d592eb-2b87-4aec-95b7-7e60558a7dff","name":"Riccardo Fala","slug":"riccardo-fala","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/37356/avatar-knHQz8HqXmxjQ5FGefV8YaPg8wEqsj.jpg","followed":false,"followsYou":false},"media":[],"resources":[{"id":"HL2jjdyZqRIWcae0ZLbj","resolved":true,"title":"Lightbox Pro","body":"$59","bodyJson":{"type":"doc","content":[{"type":"customHeading","content":[{"type":"text","text":"Upgrade Framer's native Lightbox with premium controls, custom cursors, and refined styling - without changing your workflow."}],"attrs":{"level":1}},{"type":"paragraph","content":[{"type":"text","text":"Lightbox Pro ","marks":[{"type":"bold"}]},{"type":"text","text":"is an invisible component that enhances every native Framer Lightbox on your page. Drop it onto your canvas, customise the settings, and instantly give your galleries a polished, professional feel."}]},{"type":"customHeading","content":[{"type":"text","text":"🚀 How It Works"}],"attrs":{"level":2}},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Enable Lightbox:","marks":[{"type":"bold"}]},{"type":"text","text":" Ensure Framer’s native Lightbox effect is active on your images."}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Drop & Forget:","marks":[{"type":"bold"}]},{"type":"text","text":" Drag the LightboxPro component anywhere on your canvas. Make it absolute positioning, and won't affect your layout."}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Customize:","marks":[{"type":"bold"}]},{"type":"text","text":" Use the Properties Panel to toggle your cursor, blur, and button styles."}]}]}]},{"type":"paragraph","content":[{"type":"text","text":"Note:","marks":[{"type":"bold"}]},{"type":"text","text":" Lightbox Pro enhances Framer's native Lightbox. It doesn't create a lightbox itself."}]},{"type":"customHeading","content":[{"type":"text","text":"✨ Key Features"}],"attrs":{"level":2}},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Custom \"X\" Cursor:","marks":[{"type":"bold"}]},{"type":"text","text":" Eliminate user confusion with a clear, follow-the-mouse \"X\" on the backdrop that signals exactly how to exit."}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Immersive Backdrop Blur:","marks":[{"type":"bold"}]},{"type":"text","text":" Add 0–20px of adjustable blur to isolate your content and focus attention where it matters."}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Designer Close Button:","marks":[{"type":"bold"}]}]}]}]},{"type":"orderedList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Styles:","marks":[{"type":"bold"}]},{"type":"text","text":" Minimal, Circle, Filled, or Outline."}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Positions:","marks":[{"type":"bold"}]},{"type":"text","text":" Top Left, Right, or Center ("},{"type":"text","text":"always outside the image frame","marks":[{"type":"bold"}]},{"type":"text","text":")."}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Hover States:","marks":[{"type":"bold"}]},{"type":"text","text":" Subtle Grow, Shrink, or None."}]}]}],"attrs":{"type":null,"start":1}},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Text Mode:","marks":[{"type":"bold"}]},{"type":"text","text":" Swap the icon for custom text (e.g., \"CLOSE\") with full typography and styling control."}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Smart Logic:","marks":[{"type":"bold"}]},{"type":"text","text":" Includes click-through protection so clicking the image itself won’t accidentally close the view."}]}]}]},{"type":"customHeading","content":[{"type":"emoji","attrs":{"name":"gem","emoji":"💎"}},{"type":"text","text":" Why Lightbox Pro?"}],"attrs":{"level":2}},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"One component controls every Lightbox on your page"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"No need to reconnect or replace existing images"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Lightweight and fast"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Works seamlessly with Framer's native Lightbox"}]}]}]},{"type":"paragraph","content":[{"type":"text","text":"Perfect for portfolios, photographers, agencies and premium websites.","marks":[{"type":"bold"}]}]},{"type":"paragraph"},{"type":"paragraph","content":[{"type":"text","text":"Demo:","marks":[{"type":"bold"}]},{"type":"text","text":" "},{"type":"text","text":"lightbox-pro.framer.website","marks":[{"type":"link","attrs":{"rel":"noopener noreferrer nofollow","href":"http://lightbox-pro.framer.website","class":null,"target":"_blank"}},{"type":"bold"},{"type":"italic"}]}]},{"type":"paragraph","content":[{"type":"text","text":"Looking for something simpler? Check out ","marks":[{"type":"italic"}]},{"type":"text","text":"Lightbox Lite","marks":[{"type":"link","attrs":{"rel":"noopener noreferrer nofollow","href":"https://rfstudio7.gumroad.com/l/Framer-LightboxLite","class":null,"target":"_blank"}},{"type":"bold"},{"type":"italic"}]},{"type":"text","text":" - the free version featuring the custom X cursor.","marks":[{"type":"italic"}]}]},{"type":"customHeading","content":[{"type":"text","text":"Last update:","marks":[{"type":"bold"}]}],"attrs":{"level":2}},{"type":"paragraph","content":[{"type":"text","text":"6 July","marks":[{"type":"italic"}]}]},{"type":"customHeading","content":[{"type":"text","text":"Refund Policy"}],"attrs":{"level":2}},{"type":"paragraph","content":[{"type":"text","text":"This is a digital product, so refunds are not available after purchase.If you experience any issues or bugs, contact me and I will help resolve them."}]},{"type":"paragraph"}]},"introduction":"Transform Framer's native Lightbox","slug":"lightbox-pro","author":{"framerUserId":"99d592eb-2b87-4aec-95b7-7e60558a7dff","name":"Riccardo Fala","slug":"riccardo-fala","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/37356/avatar-knHQz8HqXmxjQ5FGefV8YaPg8wEqsj.jpg","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/HL2jjdyZqRIWcae0ZLbj/lightboxprocontrols-VoY2FauPl9yHhaxPNjTAFaLyqVMoId","metadata":{"tint":{"h":300,"s":53,"l":63},"width":1600,"height":1200}}],"post":null,"createdAt":"2026-04-27T11:32:31.777Z","updatedAt":"2026-08-09T17:16:19.024Z","publishedAt":"2026-04-27T14:54:39.060Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":null,"previewUrl":"https://lightbox-pro.framer.website/","price":"5","paymentUrl":"https://gumroad.com/checkout?product=repicp&quantity=1&referrer=https%3A%2F%2Fgumroad.com%2F","workshop":false,"categories":[{"id":"7677fa83-43ce-41a2-a3fe-db438ec0fd33","name":"Interactive","slug":"interactive"}],"lastSaveId":"qRMKZk1N9P1SE66yEe5l","tags":[]}}],"contests":[],"categories":[],"tags":[],"likes":{"count":1,"liked":false},"comments":{"count":0},"reposts":{"count":0,"reposted":false,"repostId":null},"version":2,"edited":true,"editedAt":"2026-07-06T08:56:18.953Z","createdAt":"2026-04-27T14:54:39.060Z","updatedAt":"2026-07-06T08:56:18.953Z"},{"id":"019dcf6f-56e9-70cf-904d-8fc537f41d6a","title":null,"body":"

16 July 2026 update:

FrameRate video embeds are now supported. Paste either the full FrameRate iframe code or the embed URL into the FrameRate Embed field. The connected image will be used as the thumbnail and static preview.

Uploaded MP4, WebM, OGG, MOV and MKV videos continue to work as before.

","bodyJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"16 July 2026 update:"}]},{"type":"paragraph","content":[{"type":"text","text":"FrameRate video embeds are now supported.","marks":[{"type":"bold"}]},{"type":"text","text":" Paste either the full FrameRate iframe code or the embed URL into the "},{"type":"text","text":"FrameRate Embed","marks":[{"type":"bold"}]},{"type":"text","text":" field. The connected image will be used as the thumbnail and static preview."}]},{"type":"paragraph","content":[{"type":"text","text":"Uploaded MP4, WebM, OGG, MOV and MKV videos continue to work as before."}]}]},"author":{"framerUserId":"99d592eb-2b87-4aec-95b7-7e60558a7dff","name":"Riccardo Fala","slug":"riccardo-fala","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/37356/avatar-knHQz8HqXmxjQ5FGefV8YaPg8wEqsj.jpg","followed":false,"followsYou":false},"media":[],"resources":[{"id":"j41KWo2ql37npmvr0JWt","resolved":true,"title":"CMS Lightbox Gallery","body":"$5a","bodyJson":{"type":"doc","content":[{"type":"customHeading","content":[{"type":"text","text":"Turn any CMS collection into a polished fullscreen lightbox."}],"attrs":{"level":1}},{"type":"paragraph","content":[{"type":"text","text":"Open images, uploaded videos and FrameRate embeds with smooth navigation. Browse using swipe gestures, keyboard controls, on-screen arrows or an optional thumbnail strip."}]},{"type":"paragraph","content":[{"type":"text","text":"Please note:","marks":[{"type":"bold"}]},{"type":"text","text":" Framer native Gallery fields are not currently supported."}]},{"type":"paragraph","content":[{"type":"text","text":"When a video or FrameRate embed is added, it replaces the image as the main media for that item. The image remains visible as the thumbnail and static preview."}]},{"type":"customHeading","content":[{"type":"text","text":"Features"}],"attrs":{"level":2}},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Works with Framer CMS collections"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Supports images and uploaded video files"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Supports FrameRate iframe embeds"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Swipe, keyboard and button navigation"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Optional thumbnail strip"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Captions and gallery titles"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Customisable controls and styling"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Lazy loading for improved performance"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Static-renderer-safe video previews"}]}]}]},{"type":"customHeading","content":[{"type":"text","text":"How to use"}],"attrs":{"level":2}},{"type":"paragraph","content":[{"type":"text","text":"Add the component","marks":[{"type":"bold"}]},{"type":"text","text":" Place it inside your CMS item or layout."}]},{"type":"paragraph","content":[{"type":"text","text":"Connect your image","marks":[{"type":"bold"}]},{"type":"text","text":" Bind your CMS image field to the "},{"type":"text","text":"Image","marks":[{"type":"bold"}]},{"type":"text","text":" property."}]},{"type":"paragraph","content":[{"type":"text","text":"Add optional media","marks":[{"type":"bold"}]},{"type":"text","text":" Connect an uploaded video or paste a FrameRate iframe code or embed URL into "},{"type":"text","text":"FrameRate Embed","marks":[{"type":"bold"}]},{"type":"text","text":"."}]},{"type":"paragraph","content":[{"type":"text","text":"Add text","marks":[{"type":"bold"}]},{"type":"text","text":" Connect optional caption and gallery title fields."}]},{"type":"paragraph","content":[{"type":"text","text":"Create a gallery","marks":[{"type":"bold"}]},{"type":"text","text":" Give related items the same "},{"type":"text","text":"Gallery ID","marks":[{"type":"bold"}]},{"type":"text","text":" to group them into one lightbox."}]},{"type":"paragraph","content":[{"type":"text","text":"Customise","marks":[{"type":"bold"}]},{"type":"text","text":" Adjust the layout, navigation, thumbnails, colours, typography and controls from the properties panel."}]},{"type":"customImage","attrs":{"alt":"","src":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/description-image-6m7pt7tt-Ympceolz3E4mGS3w6gwD1qJ0mn2voB","link":null,"caption":"","uploadId":null}},{"type":"customImage","attrs":{"alt":"","src":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/description-image-6m7pt7tt-bH76FgLx4rPTgC000VSMg7i78UJzAC","link":null,"caption":"","uploadId":null}}]},"introduction":"Fully customisable","slug":"cms-lightbox","author":{"framerUserId":"99d592eb-2b87-4aec-95b7-7e60558a7dff","name":"Riccardo Fala","slug":"riccardo-fala","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/37356/avatar-knHQz8HqXmxjQ5FGefV8YaPg8wEqsj.jpg","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/j41KWo2ql37npmvr0JWt/cms-lightbox-Ho1QKd5k96dzcAaTK4tSQhNlcLdLDH","metadata":{"tint":{"h":0,"s":0,"l":57},"width":1600,"height":1200}}],"post":null,"createdAt":"2026-04-27T11:41:43.228Z","updatedAt":"2026-08-20T14:13:40.728Z","publishedAt":"2026-04-27T14:54:33.705Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":null,"previewUrl":"https://cms-lightbox-gallery.framer.website/","price":"19","paymentUrl":"https://gumroad.com/checkout?product=vdkbf&quantity=1&referrer=https%3A%2F%2Fgumroad.com%2F","workshop":false,"categories":[{"id":"66bb31f7-cddf-4a3e-8604-95b3467aecc2","name":"Galleries","slug":"galleries"}],"lastSaveId":"IcdQu5eq0ebIc5BAh7z3","tags":[]}}],"contests":[],"categories":[],"tags":[],"likes":{"count":14,"liked":false},"comments":{"count":6},"reposts":{"count":0,"reposted":false,"repostId":null},"version":2,"edited":true,"editedAt":"2026-07-16T19:50:07.226Z","createdAt":"2026-04-27T14:54:33.705Z","updatedAt":"2026-07-16T19:50:07.226Z"}],"pagination":{"next":null,"previous":null},"totalCount":"$undefined","feedSession":"$undefined"}]}},"children":"$L5b"}]