5c:I[333483,["/creators-assets/_next/static/immutable/chunks/16d0e6blr3zvd.js","/creators-assets/_next/static/immutable/chunks/1rdgef59pv3cw.js","/creators-assets/_next/static/immutable/chunks/0zdv1ssrxkrvj.js","/creators-assets/_next/static/immutable/chunks/0c6romi9ma0is.js","/creators-assets/_next/static/immutable/chunks/1jubx4t_1hq7l.js","/creators-assets/_next/static/immutable/chunks/30hhj9fl_j_en.js","/creators-assets/_next/static/immutable/chunks/0gxswkth5mc6b.js","/creators-assets/_next/static/immutable/chunks/33adfll0sgxzj.js","/creators-assets/_next/static/immutable/chunks/41zrh_r6fdtfq.js","/creators-assets/_next/static/immutable/chunks/36invrtoq879v.js","/creators-assets/_next/static/immutable/chunks/19-jcjdymr-fa.js","/creators-assets/_next/static/immutable/chunks/2504rifrkrd_l.js","/creators-assets/_next/static/immutable/chunks/0j6nyijn0flqd.js","/creators-assets/_next/static/immutable/chunks/2b15v_9ruhnys.js","/creators-assets/_next/static/immutable/chunks/3zq_69yv5l6lg.js","/creators-assets/_next/static/immutable/chunks/19r4rf2zyng-y.js","/creators-assets/_next/static/immutable/chunks/3h1dt97hv5ik0.js","/creators-assets/_next/static/immutable/chunks/39xjxvqtwa0x7.js","/creators-assets/_next/static/immutable/chunks/17w9c6wazundy.js","/creators-assets/_next/static/immutable/chunks/1u1uuj9mj0hoo.js","/creators-assets/_next/static/immutable/chunks/14pxn0b6e1dc9.js","/creators-assets/_next/static/immutable/chunks/2iw_-bo8jogap.js","/creators-assets/_next/static/immutable/chunks/3o1z26bd2_9eh.js","/creators-assets/_next/static/immutable/chunks/2qeyp4zfa4qwb.js","/creators-assets/_next/static/immutable/chunks/1_2vu9p6mra4j.js","/creators-assets/_next/static/immutable/chunks/2qrxli96_t9cq.js","/creators-assets/_next/static/immutable/chunks/0w757zrv0hi6k.js","/creators-assets/_next/static/immutable/chunks/3edl5e308nytq.js","/creators-assets/_next/static/immutable/chunks/14h9277o22-rl.js","/creators-assets/_next/static/immutable/chunks/37uei1iwbnu3m.js","/creators-assets/_next/static/immutable/chunks/44oc0x6k7mw-i.js","/creators-assets/_next/static/immutable/chunks/2njnkxjf39nsf.js","/creators-assets/_next/static/immutable/chunks/27vyv0cqm_295.js","/creators-assets/_next/static/immutable/chunks/3n0g19afc7srh.js","/creators-assets/_next/static/immutable/chunks/3o3dwck1w1ue6.js","/creators-assets/_next/static/immutable/chunks/1h-r9oggqjick.js","/creators-assets/_next/static/immutable/chunks/05i2jce8amocn.js","/creators-assets/_next/static/immutable/chunks/02ciyo_cdpkrz.js","/creators-assets/_next/static/immutable/chunks/3sa-o_ztvtkwe.js","/creators-assets/_next/static/immutable/chunks/2051y-i4b0nnm.js"],"PostDetailCard"] 5d:T1303,

Aesthetic Moodboard & Portfolio Grid

Overview

Unleash the ultimate visual storytelling experience on your website. The Interactive Aesthetic Moodboard & Portfolio Grid is a state-of-the-art, interactive Framer component designed specifically for designers, photographers, branding studios, and creative directors who refuse to settle for ordinary grids.

Built with pure, minimalist black-and-white sensibilities, this premium asset infuses fluid micro-interactions and high-fidelity layouts into your web portfolio. Copy and paste natively into your Framer project, configure your styling variables instantly from the visual properties sidebar, and wowed your visitors from the first second.

Key Highlights & Features

🎨 Integrated Color Extractor

Go beyond standard layouts. Inside the immersive Lightbox modal, this component features a built-in real-time color extraction system. Visitors can dynamically view, extract, and copy beautiful tonal hex codes matching your images with a single click—creating a powerful "wow" factor for design agencies and clients.

📱 Premium Customizable Device Mockup Grid

Wrap your work in a sleek, customizable bezel mockup container (inspired by modern white & silver devices). Using Framer visual controls, you can adjust:

* Bezel thickness (defaulting to a solid, premium 10px frame)

* Frame border colors and glass blurs

* Immersive dynamic island alert notifications

* Responsive shadow colors and mockup screen background color gradients

📐 3-in-1 Dynamic Layout Switcher

Allow visitors to curate their own view. Transition smoothly with absolute pixel precision between three responsive layouts using the floating toolbar switcher:

* Symmetric Square (1:1): Balanced grid alignment for bold aesthetics

* Preset Rhythm: A curated layout that alters image height dynamically

* Mixed Masonry: The ultimate creative, staggered fluid masonry flow

🖤 Minimalistic B&W Grayscale Navigation

Features a gorgeous vertical/horizontal floating categories selector. All category avatars are styled with a sophisticated grayscale filter by default, gracefully returning to clear colors only during hover or active interactions to emphasize pure structural form.

Seamless No-Code Customizability

You have 100% control over the design token architecture without writing a single line of code. Simply tweak these variables in your Framer sidebar:

* Grid Controls: Set columns (2 to 4), gap sizes, and dynamic layout modes.

* Border Radii: Independently control corner radius for portfolio cards and lightbox wrappers.

* Typography: Wire your branding's font families, weights, and sizes directly into the title, tags, and description.

* Media Support: Seamless support for high-aesthetic photography and looped silent movies.

Refund Policy

Due to the digital nature of this product (Framer Component), we generally do not offer refunds once the remix link or component URL has been accessed. However, if you encounter any technical issues or bugs that prevent the component from functioning as described, please reach out for support. We are committed to ensuring the component works perfectly in your project and will provide updates or fixes as needed.

How to Install (1-Minute Setup)

1. Purchase and open the Framer project link.

2. Select the `InteractiveMoodboard` component and press `Cmd + C` (or `Ctrl + C`).

3. Open your active workspace and press `Cmd + V` to paste it.

4. Modify the `Moodboard Items` list and tags visually in your sidebar. Enjoy your premium gallery!Aesthetic Portfolio

Interactive Moodboard
Color Extractor
Minimal Gallery
Device Mockup Grid
Framer Motion Grid
Glassmorphism Gallery
Pinterest Grid
B&W Minimalist
Masonry Grid Component

59:[["$","$L5c",null,{"post":{"id":"019e7c82-25d8-788d-8fb0-34c27666fcac","title":null,"body":null,"bodyJson":null,"author":{"framerUserId":"51ad88d5-5dd5-4981-bbd5-83e066935d2c","name":"EasySpark","slug":"easyspark","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/376332/avatar-6CGUGSBMw17kf3ZqbRDAEzUlU9ShED.jpg","followed":false,"followsYou":false},"media":[],"resources":[{"id":"vAq2RPdMAL4OJHxiF3gB","resolved":true,"title":"InteractiveMoodboard","body":"$5d","bodyJson":null,"introduction":"Aesthetic Moodboard & Portfolio Grid","slug":"interactivemoodboard","author":{"framerUserId":"51ad88d5-5dd5-4981-bbd5-83e066935d2c","name":"EasySpark","slug":"easyspark","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/376332/avatar-6CGUGSBMw17kf3ZqbRDAEzUlU9ShED.jpg","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/vAq2RPdMAL4OJHxiF3gB/interactivemoodboard-Okk6EGo7JcxMKohI8ojhM5dI0rpacn","metadata":{"tint":"hsl(0 0% 3%)","aspectRatio":1.3333333333333333}}],"post":null,"createdAt":"2026-05-23T06:29:15.679Z","updatedAt":"2026-05-31T05:29:21.277Z","publishedAt":"2026-05-31T05:29:24.696Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":null,"previewUrl":"https://interactivemoodboard.framer.website","price":"24","paymentUrl":"https://easyspark.lemonsqueezy.com/checkout/buy/3f8bad80-7450-4cb4-b7af-c9564795f446","workshop":false,"categories":[{"id":"3a855006-6097-4489-b33b-8024cb26633e","name":"Interactions","slug":"interactions"}],"lastSaveId":"wSBbzIXp0LTEFUA70DGz"}}],"contests":[],"categories":[],"tags":[],"likes":{"count":5,"liked":false},"comments":{"count":0},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2026-05-31T05:29:24.696Z","updatedAt":"2026-05-31T05:29:24.696Z","reported":false}}],"$L5e"]

Suggested for you