4f:I[267044,["/creators-assets/_next/static/immutable/chunks/456dxp3afc8vw.js","/creators-assets/_next/static/immutable/chunks/2bxtessbrg0z1.js","/creators-assets/_next/static/immutable/chunks/0bntpu9zyiup3.js","/creators-assets/_next/static/immutable/chunks/3283ev4bymz-y.js","/creators-assets/_next/static/immutable/chunks/0_p7_rfyih3ce.js","/creators-assets/_next/static/immutable/chunks/24bk4ojcoor5n.js","/creators-assets/_next/static/immutable/chunks/3x7cofmdt-u_a.js","/creators-assets/_next/static/immutable/chunks/18e_sauhpyyit.js","/creators-assets/_next/static/immutable/chunks/13xqrk3e5k8yu.js","/creators-assets/_next/static/immutable/chunks/00hohn9l3ocx9.js","/creators-assets/_next/static/immutable/chunks/3oybmd01gs-b6.js","/creators-assets/_next/static/immutable/chunks/0vxt9zvn936s0.js","/creators-assets/_next/static/immutable/chunks/1yn3k6g09tq32.js","/creators-assets/_next/static/immutable/chunks/3ly-i84yiij4i.js","/creators-assets/_next/static/immutable/chunks/1cey7skpirawe.js","/creators-assets/_next/static/immutable/chunks/3fujn21cf_mt1.js","/creators-assets/_next/static/immutable/chunks/2n9qmawfhavju.js","/creators-assets/_next/static/immutable/chunks/0m8lhf01xskqj.js","/creators-assets/_next/static/immutable/chunks/2-y_r3u4wh2s3.js","/creators-assets/_next/static/immutable/chunks/3uo-268z2xnq9.js","/creators-assets/_next/static/immutable/chunks/3q5wansxm4vp6.js","/creators-assets/_next/static/immutable/chunks/2lxef2-u417vc.js","/creators-assets/_next/static/immutable/chunks/14h9277o22-rl.js","/creators-assets/_next/static/immutable/chunks/0mgwzh6o644jl.js","/creators-assets/_next/static/immutable/chunks/0feduxwyr82nv.js","/creators-assets/_next/static/immutable/chunks/3e73rezw4k1a2.js","/creators-assets/_next/static/immutable/chunks/3xmobvbzj3637.js","/creators-assets/_next/static/immutable/chunks/0h18ahbw9nndq.js","/creators-assets/_next/static/immutable/chunks/0toe1wcov_38e.js","/creators-assets/_next/static/immutable/chunks/110hzb6dmcbdr.js","/creators-assets/_next/static/immutable/chunks/0yqk60ay0h76r.js","/creators-assets/_next/static/immutable/chunks/1zt764sfv2wd7.js","/creators-assets/_next/static/immutable/chunks/3nd1mzwm7q_f7.js","/creators-assets/_next/static/immutable/chunks/046rld3pdrzo7.js","/creators-assets/_next/static/immutable/chunks/0l9v835j421-s.js","/creators-assets/_next/static/immutable/chunks/3gx0_q52o4oil.js","/creators-assets/_next/static/immutable/chunks/2warb3xv9rce7.js","/creators-assets/_next/static/immutable/chunks/0lmmb08iwroji.js","/creators-assets/_next/static/immutable/chunks/3k6sa9ujkqb5c.js"],"S"] 50:T914,

KAIRO is a portfolio template for video studios, directors, and motion designers. It is made to show video: every project plays on hover, so visitors see your work moving the moment they land on the page.

The homepage starts with a short intro, then shows your projects in a grid that visitors can filter by category. Each project has its own page with a large cover, the key details (project, category, year, client), and a full credit list.

Features

Video component, plays on hover Any source works: YouTube, Vimeo, or files uploaded natively in Framer, with smooth, pop-free crossfades in a bento grid of mixed tile sizes.
Image component, effects on hover A matching image card adds motion effects for stills and non-video work, so nothing in the grid sits flat.
Autoplay and reveal on scroll Both components autoplay and surface project titles and details as they scroll into view, so the grid works on mobile, where hover doesn't exist.
A deep, detailed CMS Every item pulls from the CMS: video sources, still images, thumbnails, categories, and full credit lists. Adding a new project is one quick entry, no layout work, no code.
Filterable, customisable categories Visitors sort the grid by category on the fly. Rename, add, or remove categories to match your own services, nothing is locked to the demo.
Launch-ready Lightweight and responsive, with no setup tax. Remix, drop in your videos and copy, connect a domain, and go live.

Perfect for:

Video production studios & agencies
Directors & filmmakers
Motion & sound designers
Sound design & music-for-media agencies
Editors & post houses
Any creative with a reel to show

What will you get

Modern & Fully customisable responsive design
Hover-to-play video component (YouTube, Vimeo, or native upload)
Image component with hover effects
Autoplay and title reveal on scroll (mobile-friendly)
Fully CMS-driven projects
Filterable, customisable categories
Responsive and lightweight

51:T8c0,

1. Three Hover Treatments, One Component

Choose Directional Blur, Color Tint, or Black & White — no need for three separate components. Each effect shows only its own controls, so the panel stays clean.

2. Directional Blur That Points Somewhere

Most hover blurs are flat. This one has an angle control, so blur direction matches your composition. The image rotates and oversizes itself so no empty corners ever show.

3. A Title Overlay Built for Editorial Layouts

Anchor the title to any corner, add an optional bordered badge, and style typography fully via Framer's font controls — the same system used across this card family for consistent titles.

4. Keyboard-Accessible By Default

The card is focusable, and keyboard focus triggers the same effect as hover — built in from the start, not bolted on later.

5. CMS-Ready for Scalable Portfolios

Image and Title are plain property controls, so the card binds inside a Collection List — add a portfolio piece by adding a CMS item, not rebuilding a card.

Best For:

photographers,
design studios,
editorial sites,
personal portfolios,
agencies mixing image and video work.

Where To Use:

portfolio grids
case studies
editorial galleries
portfolio homepages

Why It Matters: three treatments in one component, an editorial hover feel, keyboard accessibility by default, and a shared title system with Hover Video Card for consistent mixed-media grids.

Why It Stands Out: most hover-effect components offer one effect — this offers three. The blur is genuinely angle-aware. Filter IDs are randomized per instance, so multiple cards never break each other.

Keywords: hover image card, image reveal component, photography hover effect, directional blur hover, black and white hover, image tint hover, portfolio image card, cms image gallery, framer hover effects

4e:["$","$L4f",null,{"value":{"fallback":{"$inf$activity-creator-232c0d95-92a8-4cf7-b21a-e7f9371c8b6f-all:/unified/creator/232c0d95-92a8-4cf7-b21a-e7f9371c8b6f/activity/":[{"data":[{"id":"01a1506d-abda-76fc-b79c-8822e522e117","type":"comment.liked","target":{"type":"comment","id":"01a13fa2-ef0c-7461-8a75-d2e281fb4060","preview":"hover playing thumbnails are fun","previewJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"hover playing thumbnails are fun"}]}]},"thumbnail":null,"targetDeleted":false,"owned":false,"actions":{"postId":"01a13edb-449e-749b-981b-0060808650cc","like":{"count":1,"liked":false},"reply":{"parentCommentId":"01a13fa2-ef0c-7461-8a75-d2e281fb4060"},"repost":null}},"context":{"type":"post","id":"01a13edb-449e-749b-981b-0060808650cc","preview":"New free Framer template: Kairo Moving Images🎬\nA portfolio for video studios where every project Thumbnails plays on hover. CMS-driven, filterable, responsive, and ready to launch in an afternoon. It's super Slim on Bandwith! you can use Youtube or Vimeo in you video Thumbnails!\nRemix it free here -> https://framer.link/pMxvFbP","previewJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"New free Framer template: Kairo Moving Images🎬"}]},{"type":"paragraph","content":[{"type":"text","text":"A portfolio for video studios where every project Thumbnails plays on hover. CMS-driven, filterable, responsive, and ready to launch in an afternoon. It's super Slim on Bandwith! you can use Youtube or Vimeo in you video Thumbnails!"}]},{"type":"paragraph","content":[{"type":"text","text":"Remix it free here -> "},{"type":"text","text":"https://framer.link/pMxvFbP","marks":[{"type":"link","attrs":{"rel":"noopener noreferrer nofollow","href":"https://framer.link/pMxvFbP","target":"_blank"}}]}]}]},"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/232c0d95-92a8-4cf7-b21a-e7f9371c8b6f/01a13edb-88ee-766e-a824-2b9be16338cf.jpg","targetDeleted":false,"owned":true,"actions":{"postId":"01a13edb-449e-749b-981b-0060808650cc","like":{"count":6,"liked":false},"reply":{"parentCommentId":null},"repost":{"count":0,"reposted":false,"repostId":null}}},"actors":[{"id":"232c0d95-92a8-4cf7-b21a-e7f9371c8b6f","name":"Dacil Kairo","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/232c0d95-92a8-4cf7-b21a-e7f9371c8b6f/tlpvf9zz","slug":"dacilkairo","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-10-18T19:12:07.127Z","latestAt":"2026-10-18T19:12:07.127Z"},{"id":"01a1506d-9eb3-7541-bcf6-1ca258899c14","type":"comment.reply","target":{"type":"post","id":"01a13edb-449e-749b-981b-0060808650cc","preview":"New free Framer template: Kairo Moving Images🎬\nA portfolio for video studios where every project Thumbnails plays on hover. CMS-driven, filterable, responsive, and ready to launch in an afternoon. It's super Slim on Bandwith! you can use Youtube or Vimeo in you video Thumbnails!\nRemix it free here -> https://framer.link/pMxvFbP","previewJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"New free Framer template: Kairo Moving Images🎬"}]},{"type":"paragraph","content":[{"type":"text","text":"A portfolio for video studios where every project Thumbnails plays on hover. CMS-driven, filterable, responsive, and ready to launch in an afternoon. It's super Slim on Bandwith! you can use Youtube or Vimeo in you video Thumbnails!"}]},{"type":"paragraph","content":[{"type":"text","text":"Remix it free here -> "},{"type":"text","text":"https://framer.link/pMxvFbP","marks":[{"type":"link","attrs":{"rel":"noopener noreferrer nofollow","href":"https://framer.link/pMxvFbP","target":"_blank"}}]}]}]},"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/232c0d95-92a8-4cf7-b21a-e7f9371c8b6f/01a13edb-88ee-766e-a824-2b9be16338cf.jpg","targetDeleted":false,"owned":true,"actions":{"postId":"01a13edb-449e-749b-981b-0060808650cc","like":{"count":6,"liked":false},"reply":{"parentCommentId":null},"repost":{"count":0,"reposted":false,"repostId":null}}},"context":{"type":"comment","id":"01a1506d-9e9a-70bb-9d67-ebf2edcb573a","preview":"if you scroll it starts to play automatically when layer is in view on mobile device","previewJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"if you scroll it starts to play automatically when layer is in view on mobile device"}]}]},"thumbnail":null,"targetDeleted":false,"owned":true,"actions":{"postId":"01a13edb-449e-749b-981b-0060808650cc","like":{"count":0,"liked":false},"reply":{"parentCommentId":"01a13f98-3b0c-7761-89c5-1015845d4c1e"},"repost":null}},"actors":[{"id":"232c0d95-92a8-4cf7-b21a-e7f9371c8b6f","name":"Dacil Kairo","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/232c0d95-92a8-4cf7-b21a-e7f9371c8b6f/tlpvf9zz","slug":"dacilkairo","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-10-18T19:12:03.763Z","latestAt":"2026-10-18T19:12:03.763Z"},{"id":"01a1506d-063d-71aa-a146-f040ed34c56c","type":"comment.liked","target":{"type":"comment","id":"01a13f98-3b0c-7761-89c5-1015845d4c1e","preview":"Video previews on hover make perfect sense here. Cedar has a filterable work index, and this made me think about previews for it. What do you show on touch screens, a still or tap to play?","previewJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"Video previews on hover make perfect sense here. Cedar has a filterable work index, and this made me think about previews for it. What do you show on touch screens, a still or tap to play?"}]}]},"thumbnail":null,"targetDeleted":false,"owned":false,"actions":{"postId":"01a13edb-449e-749b-981b-0060808650cc","like":{"count":1,"liked":false},"reply":{"parentCommentId":"01a13f98-3b0c-7761-89c5-1015845d4c1e"},"repost":null}},"context":{"type":"post","id":"01a13edb-449e-749b-981b-0060808650cc","preview":"New free Framer template: Kairo Moving Images🎬\nA portfolio for video studios where every project Thumbnails plays on hover. CMS-driven, filterable, responsive, and ready to launch in an afternoon. It's super Slim on Bandwith! you can use Youtube or Vimeo in you video Thumbnails!\nRemix it free here -> https://framer.link/pMxvFbP","previewJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"New free Framer template: Kairo Moving Images🎬"}]},{"type":"paragraph","content":[{"type":"text","text":"A portfolio for video studios where every project Thumbnails plays on hover. CMS-driven, filterable, responsive, and ready to launch in an afternoon. It's super Slim on Bandwith! you can use Youtube or Vimeo in you video Thumbnails!"}]},{"type":"paragraph","content":[{"type":"text","text":"Remix it free here -> "},{"type":"text","text":"https://framer.link/pMxvFbP","marks":[{"type":"link","attrs":{"rel":"noopener noreferrer nofollow","href":"https://framer.link/pMxvFbP","target":"_blank"}}]}]}]},"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/232c0d95-92a8-4cf7-b21a-e7f9371c8b6f/01a13edb-88ee-766e-a824-2b9be16338cf.jpg","targetDeleted":false,"owned":true,"actions":{"postId":"01a13edb-449e-749b-981b-0060808650cc","like":{"count":6,"liked":false},"reply":{"parentCommentId":null},"repost":{"count":0,"reposted":false,"repostId":null}}},"actors":[{"id":"232c0d95-92a8-4cf7-b21a-e7f9371c8b6f","name":"Dacil Kairo","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/232c0d95-92a8-4cf7-b21a-e7f9371c8b6f/tlpvf9zz","slug":"dacilkairo","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-10-18T19:11:24.730Z","latestAt":"2026-10-18T19:11:24.730Z"},{"id":"01a1506c-faf3-709a-af51-664bdb92c813","type":"comment.liked","target":{"type":"comment","id":"01a1401c-1b76-73ee-9018-e7d041dd43a4","preview":"Thumbnails that play on hover is exactly what a video studio portfolio needs.","previewJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"Thumbnails that play on hover is exactly what a video studio portfolio needs."}]}]},"thumbnail":null,"targetDeleted":false,"owned":false,"actions":{"postId":"01a13edb-449e-749b-981b-0060808650cc","like":{"count":1,"liked":false},"reply":{"parentCommentId":"01a1401c-1b76-73ee-9018-e7d041dd43a4"},"repost":null}},"context":{"type":"post","id":"01a13edb-449e-749b-981b-0060808650cc","preview":"New free Framer template: Kairo Moving Images🎬\nA portfolio for video studios where every project Thumbnails plays on hover. CMS-driven, filterable, responsive, and ready to launch in an afternoon. It's super Slim on Bandwith! you can use Youtube or Vimeo in you video Thumbnails!\nRemix it free here -> https://framer.link/pMxvFbP","previewJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"New free Framer template: Kairo Moving Images🎬"}]},{"type":"paragraph","content":[{"type":"text","text":"A portfolio for video studios where every project Thumbnails plays on hover. CMS-driven, filterable, responsive, and ready to launch in an afternoon. It's super Slim on Bandwith! you can use Youtube or Vimeo in you video Thumbnails!"}]},{"type":"paragraph","content":[{"type":"text","text":"Remix it free here -> "},{"type":"text","text":"https://framer.link/pMxvFbP","marks":[{"type":"link","attrs":{"rel":"noopener noreferrer nofollow","href":"https://framer.link/pMxvFbP","target":"_blank"}}]}]}]},"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/232c0d95-92a8-4cf7-b21a-e7f9371c8b6f/01a13edb-88ee-766e-a824-2b9be16338cf.jpg","targetDeleted":false,"owned":true,"actions":{"postId":"01a13edb-449e-749b-981b-0060808650cc","like":{"count":6,"liked":false},"reply":{"parentCommentId":null},"repost":{"count":0,"reposted":false,"repostId":null}}},"actors":[{"id":"232c0d95-92a8-4cf7-b21a-e7f9371c8b6f","name":"Dacil Kairo","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/232c0d95-92a8-4cf7-b21a-e7f9371c8b6f/tlpvf9zz","slug":"dacilkairo","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-10-18T19:11:21.840Z","latestAt":"2026-10-18T19:11:21.840Z"},{"id":"01a13f4a-a03c-75bd-bb34-1a70201274a8","type":"comment.liked","target":{"type":"comment","id":"01a13eea-b068-77fd-bb85-30284630ed12","preview":"hover-to-play thumbnails with youtube/vimeo support is clutch for video studios, self-hosting all those reels kills load times fast","previewJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"hover-to-play thumbnails with youtube/vimeo support is clutch for video studios, self-hosting all those reels kills load times fast"}]}]},"thumbnail":null,"targetDeleted":false,"owned":false,"actions":{"postId":"01a13edb-449e-749b-981b-0060808650cc","like":{"count":1,"liked":false},"reply":{"parentCommentId":"01a13eea-b068-77fd-bb85-30284630ed12"},"repost":null}},"context":{"type":"post","id":"01a13edb-449e-749b-981b-0060808650cc","preview":"New free Framer template: Kairo Moving Images🎬\nA portfolio for video studios where every project Thumbnails plays on hover. CMS-driven, filterable, responsive, and ready to launch in an afternoon. It's super Slim on Bandwith! you can use Youtube or Vimeo in you video Thumbnails!\nRemix it free here -> https://framer.link/pMxvFbP","previewJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"New free Framer template: Kairo Moving Images🎬"}]},{"type":"paragraph","content":[{"type":"text","text":"A portfolio for video studios where every project Thumbnails plays on hover. CMS-driven, filterable, responsive, and ready to launch in an afternoon. It's super Slim on Bandwith! you can use Youtube or Vimeo in you video Thumbnails!"}]},{"type":"paragraph","content":[{"type":"text","text":"Remix it free here -> "},{"type":"text","text":"https://framer.link/pMxvFbP","marks":[{"type":"link","attrs":{"rel":"noopener noreferrer nofollow","href":"https://framer.link/pMxvFbP","target":"_blank"}}]}]}]},"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/232c0d95-92a8-4cf7-b21a-e7f9371c8b6f/01a13edb-88ee-766e-a824-2b9be16338cf.jpg","targetDeleted":false,"owned":true,"actions":{"postId":"01a13edb-449e-749b-981b-0060808650cc","like":{"count":6,"liked":false},"reply":{"parentCommentId":null},"repost":{"count":0,"reposted":false,"repostId":null}}},"actors":[{"id":"232c0d95-92a8-4cf7-b21a-e7f9371c8b6f","name":"Dacil Kairo","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/232c0d95-92a8-4cf7-b21a-e7f9371c8b6f/tlpvf9zz","slug":"dacilkairo","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-10-15T11:20:17.713Z","latestAt":"2026-10-15T11:20:17.713Z"},{"id":"01a13b07-80f9-7339-9628-3c56060088d7","type":"template.created","target":{"type":"template","id":"75887","preview":"Kairo Moving Images","previewJson":null,"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/232c0d95-92a8-4cf7-b21a-e7f9371c8b6f/01a13b1b-a909-750a-8048-cf1b23b5763b.jpg","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"232c0d95-92a8-4cf7-b21a-e7f9371c8b6f","name":"Dacil Kairo","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/232c0d95-92a8-4cf7-b21a-e7f9371c8b6f/tlpvf9zz","slug":"dacilkairo","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":"template","visibility":"public","startedAt":"2026-10-14T15:28:29.945Z","latestAt":"2026-10-14T15:28:29.945Z"},{"id":"01a135f0-15f9-726f-b336-891a3a1640e8","type":"creator.followed","target":{"type":"creator","id":"6e4f8380-d6cb-4655-93f2-b81f15adf506","preview":"Apex Interactive","previewJson":null,"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/6e4f8380-d6cb-4655-93f2-b81f15adf506/c4a9hfpi","slug":"apex-interactive","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"232c0d95-92a8-4cf7-b21a-e7f9371c8b6f","name":"Dacil Kairo","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/232c0d95-92a8-4cf7-b21a-e7f9371c8b6f/tlpvf9zz","slug":"dacilkairo","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-10-13T15:44:49.140Z","latestAt":"2026-10-13T15:44:49.140Z"},{"id":"01a135d0-b507-74d6-ab6d-b36bdc17c667","type":"creator.followed","target":{"type":"creator","id":"2be06ac9-204d-4857-99cc-760f06f8c5e5","preview":"Abdelbaki Bahloul","previewJson":null,"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/2be06ac9-204d-4857-99cc-760f06f8c5e5/mmqtf9z6","slug":"abdelbaki-bahloul","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"232c0d95-92a8-4cf7-b21a-e7f9371c8b6f","name":"Dacil Kairo","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/232c0d95-92a8-4cf7-b21a-e7f9371c8b6f/tlpvf9zz","slug":"dacilkairo","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-10-13T15:10:32.686Z","latestAt":"2026-10-13T15:10:32.686Z"},{"id":"01a13585-589b-732d-80fd-e561df4e9c63","type":"comment.liked","target":{"type":"comment","id":"01a09af7-6e71-7601-a378-1652a559ba7d","preview":"The motion blur gives this card a great sense of depth.","previewJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"The motion blur gives this card a great sense of depth."}]}]},"thumbnail":null,"targetDeleted":false,"owned":false,"actions":{"postId":"019f1e13-62dc-737e-a067-fcaf5bf3230d","like":{"count":1,"liked":false},"reply":{"parentCommentId":"01a09af7-6e71-7601-a378-1652a559ba7d"},"repost":null}},"context":{"type":"post","id":"019f1e13-62dc-737e-a067-fcaf5bf3230d","preview":"Check our first FREE Component: Portfolio Image Card -> A portfolio image card with three switchable hover treatments: directional blur, color tint, or black & white — pick the mood per project, no extra components needed.\nThe blur isn't flat — it's angle-aware, so it points the direction your composition wants. Keyboard-focusable by default, and CMS-bindable so it scales straight from a Collection List.\nBuilt as part of a small card family — pairs with Hover Video Card (Coming Soon) for anyone running a mixed photo + video portfolio and wanting consistent title styling across both.\nFree to copy. Let me know what you build with it.","previewJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"Check our first FREE Component: Portfolio Image Card -> ","marks":[{"type":"link","attrs":{"rel":"noopener noreferrer nofollow","href":"https://framer.link/A2GSnrB","target":"_blank"}}]},{"type":"text","text":"A portfolio image card with three switchable hover treatments: directional blur, color tint, or black & white — pick the mood per project, no extra components needed."}]},{"type":"paragraph","content":[{"type":"text","text":"The blur isn't flat — it's angle-aware, so it points the direction your composition wants. Keyboard-focusable by default, and CMS-bindable so it scales straight from a Collection List."}]},{"type":"paragraph","content":[{"type":"text","text":"Built as part of a small card family — pairs with "},{"type":"text","text":"Hover Video Card (Coming Soon)","marks":[{"type":"bold"}]},{"type":"text","text":" for anyone running a mixed photo + video portfolio and wanting consistent title styling across both."}]},{"type":"paragraph","content":[{"type":"text","text":"Free to copy. Let me know what you build with it."}]}]},"thumbnail":null,"targetDeleted":false,"owned":true,"actions":{"postId":"019f1e13-62dc-737e-a067-fcaf5bf3230d","like":{"count":5,"liked":false},"reply":{"parentCommentId":null},"repost":{"count":0,"reposted":false,"repostId":null}}},"actors":[{"id":"232c0d95-92a8-4cf7-b21a-e7f9371c8b6f","name":"Dacil Kairo","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/232c0d95-92a8-4cf7-b21a-e7f9371c8b6f/tlpvf9zz","slug":"dacilkairo","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-10-13T13:48:13.846Z","latestAt":"2026-10-13T13:48:13.846Z"},{"id":"01a033eb-aaec-7346-bf53-872e42f2f063","type":"creator.followed","target":{"type":"creator","id":"e0222182-3d74-4d56-b2d9-eba289a28fa5","preview":"Andres","previewJson":null,"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/e0222182-3d74-4d56-b2d9-eba289a28fa5/ubt5ticx","slug":"andres-jimmy","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"232c0d95-92a8-4cf7-b21a-e7f9371c8b6f","name":"Dacil Kairo","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/232c0d95-92a8-4cf7-b21a-e7f9371c8b6f/tlpvf9zz","slug":"dacilkairo","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-08-24T13:17:57.859Z","latestAt":"2026-08-24T13:17:57.859Z"},{"id":"01a033eb-a7b4-726d-a5b6-8e4de248546f","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":"232c0d95-92a8-4cf7-b21a-e7f9371c8b6f","name":"Dacil Kairo","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/232c0d95-92a8-4cf7-b21a-e7f9371c8b6f/tlpvf9zz","slug":"dacilkairo","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-08-24T13:17:57.039Z","latestAt":"2026-08-24T13:17:57.039Z"},{"id":"019f842d-0340-727e-9368-44d9cabffac4","type":"creator.followed","target":{"type":"creator","id":"e384faea-043f-4f5c-bd25-070ec91488d7","preview":"Framer Geeks","previewJson":null,"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/65683/avatar-DpmNXlAfqaNbZuhHKKWXXcPtwRkgYh.jpg","slug":"framergeeks","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"232c0d95-92a8-4cf7-b21a-e7f9371c8b6f","name":"Dacil Kairo","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/232c0d95-92a8-4cf7-b21a-e7f9371c8b6f/tlpvf9zz","slug":"dacilkairo","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-07-21T10:16:10.287Z","latestAt":"2026-07-21T10:16:10.287Z"},{"id":"019f5bbd-0628-71dd-8cc1-6f6a80e6878f","type":"post.liked","target":{"type":"post","id":"019f5bbb-5baa-710a-9fdc-99393fcf0442","preview":"KATTO @Framer template preview","previewJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"KATTO "},{"type":"mention","attrs":{"id":"a7cd9fe6-cf81-4a41-8e93-bca0291dba80","slug":"framer","label":"Framer","mentionSuggestionChar":"@"}},{"type":"text","text":" template preview"}]}]},"thumbnail":"https://image.mux.com/HP1Cq01QA1JBmKHZ4hz4YCFEuJNzXJ901EuGzGbbVHH9c/thumbnail.webp?time=9.27","targetDeleted":false,"owned":false,"actions":{"postId":"019f5bbb-5baa-710a-9fdc-99393fcf0442","like":{"count":13,"liked":false},"reply":{"parentCommentId":null},"repost":{"count":0,"reposted":false,"repostId":null}}},"context":null,"actors":[{"id":"232c0d95-92a8-4cf7-b21a-e7f9371c8b6f","name":"Dacil Kairo","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/232c0d95-92a8-4cf7-b21a-e7f9371c8b6f/tlpvf9zz","slug":"dacilkairo","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-07-13T13:49:02.360Z","latestAt":"2026-07-13T13:49:02.360Z"},{"id":"019f5bbc-fe03-73f0-b0d0-287f9b7df75d","type":"post.liked","target":{"type":"post","id":"019f5bba-fb56-7017-ad97-0e2752b721b8","preview":"The fastest way to get bored as a designer?\nKeep making the same thing over and over again.\nI'd rather experiment, fail occasionally, and discover something unexpected along the way.","previewJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"The fastest way to get bored as a designer?"}]},{"type":"paragraph","content":[{"type":"text","text":"Keep making the same thing over and over again."}]},{"type":"paragraph","content":[{"type":"text","text":"I'd rather experiment, fail occasionally, and discover something unexpected along the way."}]}]},"thumbnail":"https://image.mux.com/et2YrE2HCeUj00CDMS8jTUh9b47b2VA7IAFCcsY6f6MQ/thumbnail.webp?time=1.3","targetDeleted":false,"owned":false,"actions":{"postId":"019f5bba-fb56-7017-ad97-0e2752b721b8","like":{"count":16,"liked":false},"reply":{"parentCommentId":null},"repost":{"count":0,"reposted":false,"repostId":null}}},"context":null,"actors":[{"id":"232c0d95-92a8-4cf7-b21a-e7f9371c8b6f","name":"Dacil Kairo","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/232c0d95-92a8-4cf7-b21a-e7f9371c8b6f/tlpvf9zz","slug":"dacilkairo","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-07-13T13:49:00.283Z","latestAt":"2026-07-13T13:49:00.283Z"},{"id":"019f5bbc-f2b3-719d-a38c-0fb96b447631","type":"post.liked","target":{"type":"post","id":"019f5baf-665d-74d3-a69a-a1d90c78917f","preview":"Just made my SMMA template 100% Free\nYou don't want to miss this one, link below","previewJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"Just made my SMMA template 100% Free"}]},{"type":"paragraph","content":[{"type":"text","text":"You don't want to miss this one, link below"}]}]},"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/addd49dc-5598-4a91-88e5-90856b29062a/019f7ab3-9e74-71e2-bdd6-7ea7c9ae3574.png","targetDeleted":false,"owned":false,"actions":{"postId":"019f5baf-665d-74d3-a69a-a1d90c78917f","like":{"count":23,"liked":false},"reply":{"parentCommentId":null},"repost":{"count":0,"reposted":false,"repostId":null}}},"context":null,"actors":[{"id":"232c0d95-92a8-4cf7-b21a-e7f9371c8b6f","name":"Dacil Kairo","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/232c0d95-92a8-4cf7-b21a-e7f9371c8b6f/tlpvf9zz","slug":"dacilkairo","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-07-13T13:48:57.382Z","latestAt":"2026-07-13T13:48:57.382Z"},{"id":"019f5bb1-b006-70a9-aaa9-1dba766ad43e","type":"creator.followed","target":{"type":"creator","id":"ae7e902c-1542-4db6-8891-24d45b4675e4","preview":"Serwah Attafuah","previewJson":null,"thumbnail":null,"slug":"wrathstudios","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"232c0d95-92a8-4cf7-b21a-e7f9371c8b6f","name":"Dacil Kairo","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/232c0d95-92a8-4cf7-b21a-e7f9371c8b6f/tlpvf9zz","slug":"dacilkairo","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-07-13T13:36:39.425Z","latestAt":"2026-07-13T13:36:39.425Z"},{"id":"019f5bb1-ad1f-7079-9a69-c68d338f2f98","type":"creator.followed","target":{"type":"creator","id":"938f4173-e2d4-4d74-af7b-4f735e7e87fa","preview":"Joann Kim","previewJson":null,"thumbnail":null,"slug":"joann-kim","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"232c0d95-92a8-4cf7-b21a-e7f9371c8b6f","name":"Dacil Kairo","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/232c0d95-92a8-4cf7-b21a-e7f9371c8b6f/tlpvf9zz","slug":"dacilkairo","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-07-13T13:36:38.683Z","latestAt":"2026-07-13T13:36:38.683Z"},{"id":"019f5bb1-aab1-74cc-836f-15a738117547","type":"creator.followed","target":{"type":"creator","id":"8d31eafc-b07a-4335-9e9a-c6e1f4c30750","preview":"Kalbe Haider","previewJson":null,"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/8d31eafc-b07a-4335-9e9a-c6e1f4c30750/2y23n73c","slug":"kalbe-haider","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"232c0d95-92a8-4cf7-b21a-e7f9371c8b6f","name":"Dacil Kairo","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/232c0d95-92a8-4cf7-b21a-e7f9371c8b6f/tlpvf9zz","slug":"dacilkairo","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-07-13T13:36:38.061Z","latestAt":"2026-07-13T13:36:38.061Z"},{"id":"019f5bb1-a826-77ca-baf4-8192034a8f77","type":"creator.followed","target":{"type":"creator","id":"547b6049-323f-4142-8e6d-a72f191c8f50","preview":"XIAO SUN","previewJson":null,"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/36930/908bf7d8c454be8f59654aa83b6b0ea4-mNqrHZDyKBrmYFp3Tw7rYW1l5IKocR","slug":"xiao-sun","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"232c0d95-92a8-4cf7-b21a-e7f9371c8b6f","name":"Dacil Kairo","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/232c0d95-92a8-4cf7-b21a-e7f9371c8b6f/tlpvf9zz","slug":"dacilkairo","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-07-13T13:36:37.411Z","latestAt":"2026-07-13T13:36:37.411Z"},{"id":"019f439d-61b6-7768-a12a-064ef1c7be4c","type":"creator.followed","target":{"type":"creator","id":"212d3a0f-3947-431e-a324-564459c3eec8","preview":"Mushfiq","previewJson":null,"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/212d3a0f-3947-431e-a324-564459c3eec8/z3qjrb0p","slug":"uxmushfq","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"232c0d95-92a8-4cf7-b21a-e7f9371c8b6f","name":"Dacil Kairo","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/232c0d95-92a8-4cf7-b21a-e7f9371c8b6f/tlpvf9zz","slug":"dacilkairo","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":null,"visibility":"public","startedAt":"2026-07-08T21:23:35.473Z","latestAt":"2026-07-08T21:23:35.473Z"}],"pagination":{"next":"MjAyNi0wNy0wOFQyMToyMzozNS40NzNafDAxOWY0MzlkLTYxYjYtNzc2OC1hMTJhLTA2NGVmMWM3YmU0Yw","previous":null},"totalCount":"$undefined","feedSession":"$undefined"}],"$inf$posts:232c0d95-92a8-4cf7-b21a-e7f9371c8b6f:/unified/posts/?creator=232c0d95-92a8-4cf7-b21a-e7f9371c8b6f&with=reposts":[{"data":[{"id":"01a13edb-449e-749b-981b-0060808650cc","title":null,"body":"

New free Framer template: Kairo Moving Images🎬

A portfolio for video studios where every project Thumbnails plays on hover. CMS-driven, filterable, responsive, and ready to launch in an afternoon. It's super Slim on Bandwith! you can use Youtube or Vimeo in you video Thumbnails!

Remix it free here -> https://framer.link/pMxvFbP

","bodyJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"New free Framer template: Kairo Moving Images🎬"}]},{"type":"paragraph","content":[{"type":"text","text":"A portfolio for video studios where every project Thumbnails plays on hover. CMS-driven, filterable, responsive, and ready to launch in an afternoon. It's super Slim on Bandwith! you can use Youtube or Vimeo in you video Thumbnails!"}]},{"type":"paragraph","content":[{"type":"text","text":"Remix it free here -> "},{"type":"text","text":"https://framer.link/pMxvFbP","marks":[{"type":"link","attrs":{"rel":"noopener noreferrer nofollow","href":"https://framer.link/pMxvFbP","target":"_blank"}}]}]}]},"author":{"framerUserId":"232c0d95-92a8-4cf7-b21a-e7f9371c8b6f","name":"Dacil Kairo","slug":"dacilkairo","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/232c0d95-92a8-4cf7-b21a-e7f9371c8b6f/tlpvf9zz","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/232c0d95-92a8-4cf7-b21a-e7f9371c8b6f/01a13edb-88ee-766e-a824-2b9be16338cf.jpg","metadata":{"tint":{"h":40,"s":25,"l":31},"width":2752,"height":1536}}],"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":5},"reposts":{"count":0,"reposted":false,"repostId":null},"version":2,"edited":true,"editedAt":"2026-10-15T09:19:01.068Z","createdAt":"2026-10-15T09:18:39.780Z","updatedAt":"2026-10-15T09:19:01.068Z","type":"post"},{"id":"01a13b07-7ebd-7015-b5b1-d5a497fcfc4e","title":null,"body":"

Just released a free Framer template: Kairo, a portfolio for video studios and directors.

Every project plays on hover, pulls video from YouTube, Vimeo or a native upload, and runs off a deep CMS, so adding work is one quick entry. Filterable grid, full credit lists, responsive out of the box.

Remix it free 👉 https://framer.link/pMxvFbP

#Framer #webdesign #portfolio

","bodyJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"Just released a free Framer template: Kairo, a portfolio for video studios and directors."}]},{"type":"paragraph","content":[{"type":"text","text":"Every project plays on hover, pulls video from YouTube, Vimeo or a native upload, and runs off a deep CMS, so adding work is one quick entry. Filterable grid, full credit lists, responsive out of the box."}]},{"type":"paragraph","content":[{"type":"text","text":"Remix it free 👉"},{"type":"text","text":" https://framer.link/pMxvFbP","marks":[{"type":"link","attrs":{"rel":"noopener noreferrer nofollow ugc","href":"https://framer.link/pMxvFbP","target":"_blank"}}]}]},{"type":"paragraph","content":[{"type":"text","text":"#Framer #webdesign #portfolio"}]}]},"author":{"framerUserId":"232c0d95-92a8-4cf7-b21a-e7f9371c8b6f","name":"Dacil Kairo","slug":"dacilkairo","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/232c0d95-92a8-4cf7-b21a-e7f9371c8b6f/tlpvf9zz","followed":false,"followsYou":false},"media":[],"resources":[{"id":"75887","resolved":true,"title":"Kairo Moving Images","body":"$50","bodyJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"KAIRO is a portfolio template for video studios, directors, and motion designers. It is made to show video: every project plays on hover, so visitors see your work moving the moment they land on the page."}]},{"type":"paragraph","content":[{"type":"text","text":"The homepage starts with a short intro, then shows your projects in a grid that visitors can filter by category. Each project has its own page with a large cover, the key details (project, category, year, client), and a full credit list."}]},{"type":"customHeading","content":[{"type":"text","text":"Features"}],"attrs":{"level":1}},{"type":"orderedList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Video component, plays on hover Any source works: YouTube, Vimeo, or files uploaded natively in Framer, with smooth, pop-free crossfades in a bento grid of mixed tile sizes."}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Image component, effects on hover A matching image card adds motion effects for stills and non-video work, so nothing in the grid sits flat."}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Autoplay and reveal on scroll Both components autoplay and surface project titles and details as they scroll into view, so the grid works on mobile, where hover doesn't exist."}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"A deep, detailed CMS Every item pulls from the CMS: video sources, still images, thumbnails, categories, and full credit lists. Adding a new project is one quick entry, no layout work, no code."}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Filterable, customisable categories Visitors sort the grid by category on the fly. Rename, add, or remove categories to match your own services, nothing is locked to the demo."}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Launch-ready Lightweight and responsive, with no setup tax. Remix, drop in your videos and copy, connect a domain, and go live."}]}]}],"attrs":{"type":null,"start":1}},{"type":"customHeading","content":[{"type":"text","text":"Perfect for:"}],"attrs":{"level":1}},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Video production studios & agencies"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Directors & filmmakers"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Motion & sound designers"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Sound design & music-for-media agencies"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Editors & post houses"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Any creative with a reel to show"}]}]}]},{"type":"customHeading","content":[{"type":"text","text":"What will you get"}],"attrs":{"level":1}},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Modern & Fully customisable responsive design"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Hover-to-play video component (YouTube, Vimeo, or native upload)"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Image component with hover effects"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Autoplay and title reveal on scroll (mobile-friendly)"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Fully CMS-driven projects"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Filterable, customisable categories"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Responsive and lightweight"}]}]}]},{"type":"paragraph"}]},"introduction":"Portfolio for Moving Images","slug":"kairo-moving-images","author":{"framerUserId":"232c0d95-92a8-4cf7-b21a-e7f9371c8b6f","name":"Dacil Kairo","slug":"dacilkairo","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/232c0d95-92a8-4cf7-b21a-e7f9371c8b6f/tlpvf9zz","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/232c0d95-92a8-4cf7-b21a-e7f9371c8b6f/01a13b1b-a909-750a-8048-cf1b23b5763b.jpg","metadata":{"tint":{"h":40,"s":25,"l":31},"width":1376,"height":768}},{"type":"video","url":"https://stream.mux.com/fONQdcUflmFoi001c01019XZcDC29PJ9005RisCL7jwbITw.m3u8","metadata":{"posterUrl":"https://image.mux.com/fONQdcUflmFoi001c01019XZcDC29PJ9005RisCL7jwbITw/thumbnail.webp?time=30.683","aspectRatio":"16:9","duration":43.916667}},{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/232c0d95-92a8-4cf7-b21a-e7f9371c8b6f/01a13b13-18cc-759c-bab6-bcf7745950bf.jpg","metadata":{"tint":{"h":0,"s":53,"l":66},"width":1600,"height":1200}},{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/232c0d95-92a8-4cf7-b21a-e7f9371c8b6f/01a13b00-9cc6-75e2-a3c9-4101018d8e8f.png","metadata":{"tint":{"h":0,"s":0,"l":57},"width":1675,"height":947}},{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/232c0d95-92a8-4cf7-b21a-e7f9371c8b6f/01a13b00-9cb8-71fb-81ad-76df2fee0d9a.png","metadata":{"tint":{"h":0,"s":0,"l":57},"width":1665,"height":738}}],"post":null,"createdAt":"2026-10-14T15:28:28.742Z","updatedAt":"2026-10-14T15:50:45.139Z","publishedAt":"2026-10-14T15:28:28.739Z","featuredAt":null,"approvedAt":null,"type":"template","attributes":{"price":null,"paymentUrl":"https://framer.link/pMxvFbP","remixUrl":"https://framer.link/pMxvFbP","previewUrl":"https://kairocreativestudio.framer.website/","categories":[{"id":218,"name":"Free","slug":"free-website-templates"}],"styles":[{"id":109,"name":"Modern","slug":"modern"},{"id":110,"name":"Animated","slug":"animated"},{"id":222,"name":"Grid","slug":"grid"}],"mainCategory":{"id":19,"name":"Portfolio","slug":"portfolio"},"features":[],"tags":[],"isAgentTemplate":false,"demoVideo":null,"skills":[]}}],"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-10-14T15:28:29.373Z","updatedAt":"2026-10-14T15:28:29.373Z","type":"post"},{"id":"01a135e5-c9a1-7140-a945-10404a079e81","title":null,"body":"

We are about to launch our first Template! KAIRO!

Kairo is a cinematic portfolio template for video-first studios — a showcase built so the work plays, not just sits. Motion-forward layout, a bento grid of live video tiles, quiet metadata, and a gallery-like calm that lets each piece breathe.

","bodyJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"We are about to launch our first Template! KAIRO! "}]},{"type":"paragraph","content":[{"type":"text","text":"Kairo is a cinematic portfolio template for video-first studios — a showcase built so the work plays, not just sits. Motion-forward layout, a bento grid of live video tiles, quiet metadata, and a gallery-like calm that lets each piece breathe."}]}]},"author":{"framerUserId":"232c0d95-92a8-4cf7-b21a-e7f9371c8b6f","name":"Dacil Kairo","slug":"dacilkairo","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/232c0d95-92a8-4cf7-b21a-e7f9371c8b6f/tlpvf9zz","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/232c0d95-92a8-4cf7-b21a-e7f9371c8b6f/01a135e4-2bcf-77ab-8b70-ede982371964.png","metadata":{"tint":{"h":0,"s":53,"l":66},"width":1678,"height":1011}}],"resources":[],"contests":[],"categories":[{"id":"cf35162f-8406-49a9-a023-4c58024795ee","name":"General","slug":"general","description":"General","metaTitle":"General","metaDescription":"General"}],"tags":[],"likes":{"count":3,"liked":false},"comments":{"count":1},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2026-10-13T15:33:34.246Z","updatedAt":"2026-10-13T15:33:34.246Z","type":"post"},{"id":"019f1e13-62dc-737e-a067-fcaf5bf3230d","title":null,"body":"

Check our first FREE Component: Portfolio Image Card -> A portfolio image card with three switchable hover treatments: directional blur, color tint, or black & white — pick the mood per project, no extra components needed.

The blur isn't flat — it's angle-aware, so it points the direction your composition wants. Keyboard-focusable by default, and CMS-bindable so it scales straight from a Collection List.

Built as part of a small card family — pairs with Hover Video Card (Coming Soon) for anyone running a mixed photo + video portfolio and wanting consistent title styling across both.

Free to copy. Let me know what you build with it.

","bodyJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"Check our first FREE Component: Portfolio Image Card -> ","marks":[{"type":"link","attrs":{"rel":"noopener noreferrer nofollow","href":"https://framer.link/A2GSnrB","target":"_blank"}}]},{"type":"text","text":"A portfolio image card with three switchable hover treatments: directional blur, color tint, or black & white — pick the mood per project, no extra components needed."}]},{"type":"paragraph","content":[{"type":"text","text":"The blur isn't flat — it's angle-aware, so it points the direction your composition wants. Keyboard-focusable by default, and CMS-bindable so it scales straight from a Collection List."}]},{"type":"paragraph","content":[{"type":"text","text":"Built as part of a small card family — pairs with "},{"type":"text","text":"Hover Video Card (Coming Soon)","marks":[{"type":"bold"}]},{"type":"text","text":" for anyone running a mixed photo + video portfolio and wanting consistent title styling across both."}]},{"type":"paragraph","content":[{"type":"text","text":"Free to copy. Let me know what you build with it."}]}]},"author":{"framerUserId":"232c0d95-92a8-4cf7-b21a-e7f9371c8b6f","name":"Dacil Kairo","slug":"dacilkairo","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/232c0d95-92a8-4cf7-b21a-e7f9371c8b6f/tlpvf9zz","followed":false,"followsYou":false},"media":[{"type":"link-preview","url":"https://framer.link/A2GSnrB","metadata":{"title":"Portfolio Image Card: Free Interactions Component by Dacil Kairo","description":"Portfolio image card CMS Ready — Portfolio Image Card by Dacil Kairo — explore this Framer Component on the Framer Marketplace and customize it in Framer's no-code website builder.","imageUrl":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/opengraph/3988b8cef9cd4d94/image.png","siteName":"Framer Community","faviconUrl":null}}],"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":1},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2026-07-01T14:26:54.817Z","updatedAt":"2026-07-01T14:26:54.817Z","type":"post"},{"id":"019f1395-b65a-715b-82eb-52b4b7952231","title":null,"body":"

Hover Image Card — free, out now 🎬

A portfolio image card with three switchable hover treatments: directional blur, color tint, or black & white — pick the mood per project, no extra components needed.

The blur isn't flat — it's angle-aware, so it points the direction your composition wants. Keyboard-focusable by default, and CMS-bindable so it scales straight from a Collection List.

Built as part of a small card family — pairs with Hover Video Card (Coming Soon) for anyone running a mixed photo + video portfolio and wanting consistent title styling across both.

Free to copy. Let me know what you build with it.

","bodyJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"Hover Image Card — free, out now ","marks":[{"type":"bold"}]},{"type":"emoji","attrs":{"name":"clapper","emoji":"🎬"}}]},{"type":"paragraph","content":[{"type":"text","text":"A portfolio image card with three switchable hover treatments: directional blur, color tint, or black & white — pick the mood per project, no extra components needed."}]},{"type":"paragraph","content":[{"type":"text","text":"The blur isn't flat — it's angle-aware, so it points the direction your composition wants. Keyboard-focusable by default, and CMS-bindable so it scales straight from a Collection List."}]},{"type":"paragraph","content":[{"type":"text","text":"Built as part of a small card family — pairs with "},{"type":"text","text":"Hover Video Card (Coming Soon)","marks":[{"type":"bold"}]},{"type":"text","text":" for anyone running a mixed photo + video portfolio and wanting consistent title styling across both."}]},{"type":"paragraph","content":[{"type":"text","text":"Free to copy. Let me know what you build with it."}]}]},"author":{"framerUserId":"232c0d95-92a8-4cf7-b21a-e7f9371c8b6f","name":"Dacil Kairo","slug":"dacilkairo","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/232c0d95-92a8-4cf7-b21a-e7f9371c8b6f/tlpvf9zz","followed":false,"followsYou":false},"media":[],"resources":[{"id":"BASNzM4wK2YhMSMgCFqe","resolved":true,"title":"Portfolio Image Card","body":"$51","bodyJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"1. Three Hover Treatments, One Component","marks":[{"type":"bold"}]},{"type":"text","text":" "}]},{"type":"paragraph","content":[{"type":"text","text":"Choose Directional Blur, Color Tint, or Black & White — no need for three separate components. Each effect shows only its own controls, so the panel stays clean."}]},{"type":"paragraph","content":[{"type":"text","text":"2. Directional Blur That Points Somewhere","marks":[{"type":"bold"}]},{"type":"text","text":" "}]},{"type":"paragraph","content":[{"type":"text","text":"Most hover blurs are flat. This one has an angle control, so blur direction matches your composition. The image rotates and oversizes itself so no empty corners ever show."}]},{"type":"paragraph","content":[{"type":"text","text":"3. A Title Overlay Built for Editorial Layouts","marks":[{"type":"bold"}]},{"type":"text","text":" "}]},{"type":"paragraph","content":[{"type":"text","text":"Anchor the title to any corner, add an optional bordered badge, and style typography fully via Framer's font controls — the same system used across this card family for consistent titles."}]},{"type":"paragraph","content":[{"type":"text","text":"4. Keyboard-Accessible By Default","marks":[{"type":"bold"}]},{"type":"text","text":" "}]},{"type":"paragraph","content":[{"type":"text","text":"The card is focusable, and keyboard focus triggers the same effect as hover — built in from the start, not bolted on later."}]},{"type":"paragraph","content":[{"type":"text","text":"5. CMS-Ready for Scalable Portfolios","marks":[{"type":"bold"}]},{"type":"text","text":" "}]},{"type":"paragraph","content":[{"type":"text","text":"Image and Title are plain property controls, so the card binds inside a Collection List — add a portfolio piece by adding a CMS item, not rebuilding a card."}]},{"type":"paragraph","content":[{"type":"text","text":"Best For","marks":[{"type":"bold"}]},{"type":"text","text":": "}]},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"photographers, "}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"design studios, "}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"editorial sites, "}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"personal portfolios, "}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"agencies mixing image and video work."}]}]}]},{"type":"paragraph","content":[{"type":"text","text":"Where To Use:","marks":[{"type":"bold"}]},{"type":"text","text":" "}]},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"portfolio grids"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"case studies"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"editorial galleries"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"portfolio homepages"}]}]}]},{"type":"paragraph","content":[{"type":"text","text":"Why It Matters: ","marks":[{"type":"bold"}]},{"type":"text","text":"three treatments in one component, an editorial hover feel, keyboard accessibility by default, and a shared title system with Hover Video Card for consistent mixed-media grids."}]},{"type":"paragraph","content":[{"type":"text","text":"Why It Stands Out:","marks":[{"type":"bold"}]},{"type":"text","text":" most hover-effect components offer one effect — this offers three. The blur is genuinely angle-aware. Filter IDs are randomized per instance, so multiple cards never break each other. "}]},{"type":"paragraph","content":[{"type":"text","text":"Keywords: hover image card, image reveal component, photography hover effect, directional blur hover, black and white hover, image tint hover, portfolio image card, cms image gallery, framer hover effects","marks":[{"type":"italic"}]}]}]},"introduction":"Portfolio image card CMS Ready","slug":"portfolio-image-card","author":{"framerUserId":"232c0d95-92a8-4cf7-b21a-e7f9371c8b6f","name":"Dacil Kairo","slug":"dacilkairo","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/232c0d95-92a8-4cf7-b21a-e7f9371c8b6f/tlpvf9zz","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/232c0d95-92a8-4cf7-b21a-e7f9371c8b6f/4txrwp0q","metadata":{"tint":{"h":0,"s":0,"l":57},"width":1180,"height":697}}],"post":null,"createdAt":"2026-06-29T13:33:26.461Z","updatedAt":"2026-06-29T14:03:01.265Z","publishedAt":"2026-06-29T13:33:26.458Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":"https://framer.com/m/Portfolio-Image-Card-sX3lyU.js@ftJ9ZPXFbLPKQVbjx3aK","previewUrl":"https://motionblurportfoliocard.framer.website/","price":null,"paymentUrl":null,"workshop":false,"categories":[{"id":"c3e183d1-597a-4479-8a6f-244ae3c96f40","name":"Cards","slug":"cards"}],"lastSaveId":"ftJ9ZPXFbLPKQVbjx3aK","tags":[]}}],"contests":[],"categories":[],"tags":[],"likes":{"count":59,"liked":false},"comments":{"count":2},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2026-06-29T13:33:26.491Z","updatedAt":"2026-06-29T13:33:26.491Z","type":"post"}],"pagination":{"next":null,"previous":null},"totalCount":"$undefined","feedSession":"$undefined"}]}},"children":"$L52"}]