5c:I[267044,["/creators-assets/_next/static/immutable/chunks/356g_j0l71_46.js","/creators-assets/_next/static/immutable/chunks/3gx96u50v9idb.js","/creators-assets/_next/static/immutable/chunks/125_ce2ese0y_.js","/creators-assets/_next/static/immutable/chunks/2ii8lkleumgkk.js","/creators-assets/_next/static/immutable/chunks/1jubx4t_1hq7l.js","/creators-assets/_next/static/immutable/chunks/0c6romi9ma0is.js","/creators-assets/_next/static/immutable/chunks/069_m7850i8jf.js","/creators-assets/_next/static/immutable/chunks/03586ab1rea-b.js","/creators-assets/_next/static/immutable/chunks/19qq0hy3mz_vv.js","/creators-assets/_next/static/immutable/chunks/2oixy7hansmjm.js","/creators-assets/_next/static/immutable/chunks/2rczsbgoa3afm.js","/creators-assets/_next/static/immutable/chunks/2a63j-5qkrdf4.js","/creators-assets/_next/static/immutable/chunks/2504rifrkrd_l.js","/creators-assets/_next/static/immutable/chunks/0-lv0573a1cyl.js","/creators-assets/_next/static/immutable/chunks/3kkqflhmmpg9p.js","/creators-assets/_next/static/immutable/chunks/0ib-rcz4b0eq3.js","/creators-assets/_next/static/immutable/chunks/0mgwzh6o644jl.js","/creators-assets/_next/static/immutable/chunks/24gcuxpvxd8dy.js","/creators-assets/_next/static/immutable/chunks/0xd4yj8g3g-ci.js","/creators-assets/_next/static/immutable/chunks/2-y_r3u4wh2s3.js","/creators-assets/_next/static/immutable/chunks/3vd9_7_mqx0kl.js","/creators-assets/_next/static/immutable/chunks/3l37d07td4kzk.js","/creators-assets/_next/static/immutable/chunks/14h9277o22-rl.js","/creators-assets/_next/static/immutable/chunks/3nw4q_evu8ge1.js","/creators-assets/_next/static/immutable/chunks/3o5qsyzxffd89.js","/creators-assets/_next/static/immutable/chunks/0sdd6rzuigoor.js","/creators-assets/_next/static/immutable/chunks/04onqby6uwgz7.js","/creators-assets/_next/static/immutable/chunks/16d5vpfsnfybw.js","/creators-assets/_next/static/immutable/chunks/3f4d4x4z1mrzh.js","/creators-assets/_next/static/immutable/chunks/0yulab_mho2q7.js","/creators-assets/_next/static/immutable/chunks/3_6nvj55e699g.js","/creators-assets/_next/static/immutable/chunks/2r15b2hek61lg.js","/creators-assets/_next/static/immutable/chunks/14pxn0b6e1dc9.js","/creators-assets/_next/static/immutable/chunks/0pc9t50m5x90i.js","/creators-assets/_next/static/immutable/chunks/3fyhezch4qqad.js","/creators-assets/_next/static/immutable/chunks/3eh5q_6ksmw0l.js","/creators-assets/_next/static/immutable/chunks/2rdaqkxiyeq_6.js","/creators-assets/_next/static/immutable/chunks/2qeyp4zfa4qwb.js","/creators-assets/_next/static/immutable/chunks/0v2aom8xv86j9.js","/creators-assets/_next/static/immutable/chunks/19r4rf2zyng-y.js","/creators-assets/_next/static/immutable/chunks/0s-n7u5-dwtml.js"],"S"] 5d:T75c,

Description

This component is a smooth, visually rich left-to-right sliding image carousel enhanced with a fully customizable animated border made of stars, circles, triangles, glowing lights, or shining gold stars. Each image transitions using Framer Motion’s spring-based slide animation, creating a fluid, polished gallery experience suitable for hero sections, banners, or product showcases.

✨ Key Features

Sliding Animation:Uses Framer Motion to animate images entering and exiting from left or right based on navigation direction.
Animated Border:A unique perimeter animation where shapes continuously travel around the edge of the carousel.
- Shapes include: Star, Circle, Triangle, Colorful Lights, Shining Gold Star
- Adjustable color, size, and speed
- Smooth looping animation using requestAnimationFrame
Autoplay Support:Enables automatic slide transitions with customizable interval timing.
Dot Navigation:Minimal dot indicators that match your theme, with adjustable inactive and active colors.
Responsive Image Control:Uses Framer’s responsive image picker, supporting up to 10 images.
Framer-Ready:Includes full Property Controls for seamless customization in the Framer editor.

🎛️ Customizable Controls

Auto-play & interval
Dot visibility & colors
Shape type (star/circle/triangle/colorful/gold)
Shape size & animation speed
Border width

5e:T7ed,

Description

This component renders a high-performance fullscreen WebGL shader animation inside Framer using a fully custom GLSL fragment shader. It supports reactive controls, viewport-based pausing, and dynamic uniforms such as time, iterations, speed, and scale.

Designed for Framer projects that require GPU-accelerated visual effects, this component draws a fullscreen quad and runs a radial, multi-iteration shader producing a vibrant ray-based energy field effect.

The system uses requestAnimationFrame, device-pixel-ratio scaling, WebGL blending, resize observers, and cleanup logic to ensure smooth performance and memory-safe teardown inside the Framer environment.

Key Features

✔️ Fully programmable GLSL fragment shader
✔️ Dynamic uniforms: time, resolution, iterations, scale, speed
✔️ Adjustable controls via Framer Property Controls
✔️ Automatically pauses when off-screen (optional)
✔️ Matches parent container size at all times via ResizeObserver
✔️ Proper WebGL context cleanup and resource disposal
✔️ Optional background layer for blending with other elements
✔️ Render-still fallback for Static Renderer Mode

Use Cases

Animated hero backgrounds
Reactive visualizers in landing pages
Abstract UI effects for apps or websites
Ambient animated themes
Shader-driven design systems

This component provides a plug-and-play WebGL animation pipeline for Framer — ideal for creators who want custom shader visuals without relying on heavy libraries or external engines.

5f:T559,

DESCRIPTION

This component provides a sleek, full-screen preloader for Framer projects, featuring a centered logo surrounded by animated ripple circles. The loader is highly customizable, allowing creators to fine-tune the logo, colors, animation easing, ripple count, blur intensity, and overall size.

The logo can be rendered using either an uploaded image or custom SVG markup, making the component flexible for any brand identity. Each ripple expands and contracts in a smooth loop, while the logo gently fades to create a polished, modern loading experience.

Key features include:

Full-screen fixed-position loader overlay
Animated ripple rings with adjustable count, size, delay, and easing
Central logo with fade animation, supporting both SVG and image uploads
Gradient-based ripple styling with blur and soft highlights
Fully configurable via Framer property controls
Responsive sizing with clean, minimal visual design
Layered z-index structure for precise animation depth

Ideal for web apps, splash screens, portfolio projects, and any Framer site requiring a refined, branded loading screen.

60:T647,

Description:

The 3D Motion Carousel is a dynamic Framer component that brings your images to life in a smooth, rotating 3D-style circular layout. Each image orbits around a central axis with realistic motion, glow effects, and interactive drag control — perfect for portfolios, product galleries, or immersive visual presentations.

Built with Framer Motion and optimized for performance, this component combines continuous rotation with user-driven drag input, giving creators full control over motion and styling.

Key features:

🌀 3D Rotating Layout — Images orbit in a circular arrangement with seamless looping rotation.
🖱️ Interactive Drag Control — Click and drag to manually adjust carousel speed and direction.
✨ Optional Glow Effect — Add a subtle or vibrant ambient glow for visual depth.
🎞️ Smooth Animation Engine — Powered by Framer Motion for fluid transitions and performance.
🎨 Fully Customizable — Adjust radius, rotation speed, image size, corner radius, and colors directly in Framer.
🧠 Smart Auto-Rotation Pause — Automatically stops spinning while dragging for precise control.

Perfect for designer portfolios, creative showcases, or brand presentations, this carousel adds motion-driven sophistication to any layout.

61:T67d,

Description

Generative Art Animation is a Framer-ready React component that renders a smooth, continuously evolving waveform-style artwork using the HTML5 Canvas API.Inspired by p5.js generative patterns, the component recreates multi-layered oscillating line structures built from trigonometric motion, envelope shaping, and center-weighted complexity.

The animation generates pairs of mirrored line curves that shift, ripple, and morph over time based on sinusoidal functions. Each frame recalculates point positions to create an organic, fluid, and highly customizable motion field.

Users can fully control the appearance and behavior through Framer property controls—adjusting colors, opacity, line counts, point density, background rendering, and animation speed.

This component is optimized for both static rendering (Framer preview/export) and real-time animation, automatically handling device pixel ratio for sharp output on Retina displays.

✨ Features

Smooth generative animation using pure Canvas (no dependencies)
Dynamic waveform lines with layered motion complexity
Fully exposed Framer property controls:
- Line color & alpha
- Background visibility
- Number of lines & points
- Animation speed
Supports transparent mode (remove background)
Retina-sharp rendering with automatic scaling
Works in both live and static Framer modes
Lightweight and performance-optimized

62:T485,

The ImageGallery3D component transforms your images into an interactive 3D cube, rotating smoothly across six faces to showcase up to six images in a captivating animation. Perfect for portfolios, showcases, or visual storytelling, this gallery brings depth and motion to your Framer projects.

✨ Key Features:

True 3D cube rotation with perspective and smooth transitions
Up to 6 images (front, back, left, right, top, bottom)
Autoplay mode with adjustable delay, speed, and rotation direction
Dynamic background color transitions synced to cube movement
Responsive cube size and high-performance CSS animations
No external dependencies — 100% copyright-free

Built using React and Framer’s Control API, this component delivers a polished, motion-rich, and fully customizable 3D gallery experience right inside your Framer canvas.

63:T4cc,

Description:This React + Framer component, Animated Pixel Grid, creates a mesmerizing colorful pixel animation that grows, shrinks, and flickers dynamically across the screen. Each pixel behaves independently expanding and contracting in rhythmic waves—resulting in a vibrant, pulsating mosaic effect.

The animation runs on an HTML5 <canvas> for smooth performance and reacts to clicks or resizing, reinitializing the pixel layout dynamically. Users can customize various visual and motion parameters directly from Framer’s property panel, including:

Background type — choose between solid color or image backdrop.
Pixel gap — controls pixel density across the grid.
Animation speed — defines the flickering and growth pace.
Hue range & color count — generates a spectrum of dynamic colors.

This component is perfect for creative backgrounds, loading screens, or interactive art sections, bringing a lively and organic energy to any Framer project.

64:T5e8,

Description:This React component creates a modern, responsive image gallery with a large hero image and a row or column of interactive thumbnails. Built for Framer, it allows users to seamlessly browse images with smooth transitions, hover effects, and keyboard navigation.

The hero image updates dynamically when a thumbnail is clicked or selected, and the layout automatically adapts to the selected thumbnail position — either below or to the right of the main image.

Key features include:

🔄 Dynamic hero image transitions with adjustable animation duration.
🎞️ Thumbnail navigation supporting hover previews and click-to-view interaction.
⌨️ Keyboard navigation using arrow keys for quick browsing.
🧭 Configurable layout — place thumbnails on the bottom or right side.
⚙️ Customizable settings for spacing, aspect ratios, opacities, and more through Framer’s property controls.

Perfect for portfolios, product showcases, or creative galleries, this component combines ease of customization with smooth UX animations — all inside Framer’s visual design environment.

65:T618,

Description:This Framer component creates a customizable editable heading with a striking long 3D text shadow effect and an optional gradient or solid background. Users can directly edit the text on the canvas, making it perfect for creating hero titles, bold typographic posters, or dynamic visual headers.

The shadow depth is generated programmatically by stacking multiple shadow layers, creating a realistic 3D extrusion effect. The component is fully configurable in Framer’s property panel — you can adjust:

🖋️ Text Content – Editable directly or via Framer properties.
🎨 Shadow Distance & Color – Control how far and deep the 3D effect appears.
🌈 Background Options – Choose between a solid or gradient background.
🔤 Font Settings – Adjust font type, weight, size, spacing, and more.
🪶 Live Editing – Click and type directly on the canvas for instant updates.

The design uses smooth transitions for text updates (startTransition) and leverages CSS layering to create rich, dimensional shadows. With just a few tweaks, this component can transform simple text into stunning 3D typography suitable for modern UI hero sections, splash screens, or digital posters.

66:T752,

Description:This Image_Fx_Gallery component creates a cinematic photo display with a striking mirror reflection and a progressive blur overlay, delivering a polished, glassy visual effect. Designed for Framer, it lets users showcase their images in a modern and interactive style.

At the top, the main image appears crisp and vivid, while the lower half reflects it perfectly, mimicking a glossy surface reflection. Between them, a layered blur gradient gradually increases in intensity, giving the gallery a smooth depth and transition effect — similar to what you’d see in professional motion graphics or photography portfolios.

Below the reflection, a thumbnail navigation bar allows users to switch between images with smooth transitions and elegant highlights. Each thumbnail features customizable borders, spacing, and rounded corners for flexible design control.

Key Features:

🪞 Realistic reflection effect with flipped imagery.
🌫️ Progressive blur gradient overlay for a cinematic feel.
🎞️ Smooth transitions using Framer’s state handling.
🖼️ Interactive thumbnails with selection highlights and hover effects.
🎨 Customizable colors, borders, and spacing directly from Framer controls.

This component is perfect for creative portfolios, photography showcases, digital art displays, or any modern web experience that values visual storytelling with depth and elegance.

67:T4e7,

GridDistortion is a high-performance Framer component that transforms any static image into a responsive, animated grid of pixels — dynamically warping in real time as users move their mouse. Built entirely with Three.js and custom GLSL shaders, it produces a visually striking ripple distortion or liquid grid effect that adds motion and depth to your designs.

This component divides your image into a configurable grid and uses interactive physics-based deformation to simulate realistic wave movement. The mouse position, velocity, and grid density directly influence the distortion pattern, while adjustable parameters like strength, relaxation, and mouse influence radius give you full control over animation smoothness and responsiveness.

Ideal for hero sections, backgrounds, interactive art pieces, or modern UI motion effects, GridDistortion delivers fluid motion and elegant interactivity — seamlessly integrated inside Framer’s design environment.

68:T4f5,

Description:

This Threads component creates an elegant and organic animated thread effect using WebGL (via OGL) and GLSL shaders. The animation is built from multiple flowing lines that respond to time, amplitude, and mouse interaction — creating a fluid, living motion similar to strands of light or waves in motion.

The fragment shader drives the animation using Perlin noise to generate smooth, natural distortions across the threads, while amplitude and distance parameters control the motion’s intensity and spread. Optional mouse interaction adds dynamic interactivity, letting the user subtly influence the wave flow in real time.

This code is ideal for:

Hero backgrounds in creative portfolios
Interactive web animations
Framer motion effects or visual identity components

It delivers a minimalist yet futuristic visual style, combining smooth GLSL motion with performance-optimized rendering through OGL’s lightweight architecture.

69:T47b,

Description:

This Interactive 3D Image Carousel component creates a stunning depth-based image gallery with realistic hover and perspective effects. Each image dynamically tilts and pops forward as the user hovers, creating a smooth, fluid 3D illusion inspired by modern motion design.

Built with React + Framer, it uses:

🎨 Dynamic hover zones for fine-grained control of perspective.
🧭 Adaptive depth calculations based on mouse position.
⚡ Smooth transitions between hover and rest states.
🖼️ Customizable appearance — border, shadow, opacity, and scale.
🌌 Adjustable 3D perspective and animation smoothness controls.

This effect gives a cinematic scrolling experience, perfect for product galleries, art portfolios, or modern website headers where interactivity meets aesthetics.

57:["$","$L5c",null,{"value":{"fallback":{"$inf$activity-creator-d0b6aa04-ee5a-4991-9949-9ab840bfebac-all:/unified/creator/d0b6aa04-ee5a-4991-9949-9ab840bfebac/activity/":[{"data":[],"pagination":{"next":null,"previous":null},"totalCount":"$undefined","feedSession":"$undefined"}],"$inf$posts:d0b6aa04-ee5a-4991-9949-9ab840bfebac:/unified/posts/?creator=d0b6aa04-ee5a-4991-9949-9ab840bfebac&with=reposts":[{"data":[{"id":"019b350b-a928-7032-86c4-dd6e7c4b466f","title":null,"body":null,"bodyJson":null,"author":{"framerUserId":"d0b6aa04-ee5a-4991-9949-9ab840bfebac","name":"RAMDIN SINGH","slug":"ramdin-singh","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1332055/avatar-RQRwIx1ftH09YkE4bNvMYkX0Z9V2HX.jpg","followed":false,"followsYou":false},"media":[],"resources":[{"id":"cSI0R8FvTB1qsS7WhPzk","resolved":true,"title":"Slid Image Carousel","body":"$5d","bodyJson":null,"introduction":"https://harman-design.lemonsqueezy.com/c","slug":"slid-image-carousel","author":{"framerUserId":"d0b6aa04-ee5a-4991-9949-9ab840bfebac","name":"RAMDIN SINGH","slug":"ramdin-singh","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1332055/avatar-RQRwIx1ftH09YkE4bNvMYkX0Z9V2HX.jpg","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/cSI0R8FvTB1qsS7WhPzk/slid-image-carousel-zqMVyNNw2HGZhj3nrTrUKGC3BbDoiK","metadata":{"tint":{"h":0,"s":0,"l":3},"width":1600,"height":1200}}],"post":null,"createdAt":"2025-12-10T08:47:39.795Z","updatedAt":"2026-01-18T11:06:20.163Z","publishedAt":"2025-12-19T05:18:35.304Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":null,"previewUrl":"https://clear-designers-518500.framer.app/","price":"5","paymentUrl":"https://harman-design.lemonsqueezy.com/checkout/buy/ea555a2e-fc68-4e26-a0ac-1a82f5344af5","workshop":true,"categories":[{"id":"8f93ccfe-423c-47f2-b8ae-79e9e132012f","name":"Carousels","slug":"carousels"}],"lastSaveId":"2FnL2mwDUC75zglIgYRP","tags":[]}}],"contests":[],"categories":[],"tags":[],"likes":{"count":1,"liked":false},"comments":{"count":1},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2025-12-19T05:18:35.304Z","updatedAt":"2025-12-19T05:18:35.304Z"},{"id":"019b0148-c1be-7c89-9e5f-da34bec0f0f7","title":null,"body":null,"bodyJson":null,"author":{"framerUserId":"d0b6aa04-ee5a-4991-9949-9ab840bfebac","name":"RAMDIN SINGH","slug":"ramdin-singh","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1332055/avatar-RQRwIx1ftH09YkE4bNvMYkX0Z9V2HX.jpg","followed":false,"followsYou":false},"media":[],"resources":[{"id":"vDOkSlytGVKK9jgJPTA0","resolved":true,"title":"Shader_Background_3D","body":"

Description

This component renders a fully dynamic, WebGL-powered animated shader background for Framer. Designed with performance and creative flexibility in mind, it uses fragment shaders to generate shifting organic patterns that react to speed, palette, and viewport visibility. The animation pauses automatically when out of view, conserving resources.

You can switch between four palettes — Default, Sunset, Cool, and Neon — each driven by cosine-based color oscillations for smooth transitions. The speed control adjusts the animation flow, while the paused toggle instantly freezes rendering. Built as a highly configurable visual block, it integrates seamlessly into Framer layouts and provides a sleek futuristic aesthetic for landing pages, hero sections, or full-screen backgrounds.

","bodyJson":null,"introduction":"","slug":"shader-background-3d","author":{"framerUserId":"d0b6aa04-ee5a-4991-9949-9ab840bfebac","name":"RAMDIN SINGH","slug":"ramdin-singh","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1332055/avatar-RQRwIx1ftH09YkE4bNvMYkX0Z9V2HX.jpg","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/vDOkSlytGVKK9jgJPTA0/3dshader-background-q0R4LL9TrOeZSTKn0wIvEJOErH2RMN","metadata":{"tint":{"h":0,"s":0,"l":58},"width":1600,"height":1200}}],"post":null,"createdAt":"2025-12-01T09:38:29.491Z","updatedAt":"2026-01-03T11:03:05.179Z","publishedAt":"2025-12-09T04:05:04.062Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":null,"previewUrl":"https://shining-everything-009243.framer.app/","price":"5","paymentUrl":"https://harman-design.lemonsqueezy.com/buy/95bb9445-74ed-42ad-8b02-1d8086eb7d31","workshop":true,"categories":[{"id":"1a3a0eb3-698e-461a-bf42-2502a7ed43e0","name":"Backgrounds","slug":"backgrounds"}],"lastSaveId":"ZKDQIcTiragXoogWoZaa","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":"2025-12-09T04:05:04.062Z","updatedAt":"2025-12-09T04:05:04.062Z"},{"id":"019b0144-968c-7315-9216-a63fb533fef8","title":null,"body":null,"bodyJson":null,"author":{"framerUserId":"d0b6aa04-ee5a-4991-9949-9ab840bfebac","name":"RAMDIN SINGH","slug":"ramdin-singh","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1332055/avatar-RQRwIx1ftH09YkE4bNvMYkX0Z9V2HX.jpg","followed":false,"followsYou":false},"media":[],"resources":[{"id":"YbMWfO0g4Dq7WngPuO8W","resolved":true,"title":"Loading_Spinner","body":"

Description

This Framer component renders a high-performance animated loading spinner featuring three independently rotating colored sectors and a smoothly pulsing central label. Designed for full visual flexibility, it supports custom backgrounds (solid or image), blend modes, border thickness, fonts, and color control for all visual layers.

The spinner animates only when visible on screen, thanks to Framer’s useInView optimization, making it lightweight and suitable for both landing pages and app loaders.

The pulsing text cycles through multiple opacity levels, while each colored sector rotates at a different speed to create a dynamic multi-layered spinner effect. Fully responsive and customizable via Framer’s property controls.

","bodyJson":null,"introduction":"","slug":"animatloadingspinner","author":{"framerUserId":"d0b6aa04-ee5a-4991-9949-9ab840bfebac","name":"RAMDIN SINGH","slug":"ramdin-singh","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1332055/avatar-RQRwIx1ftH09YkE4bNvMYkX0Z9V2HX.jpg","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/YbMWfO0g4Dq7WngPuO8W/animatloadingspinner-12RikQtLQgLno8MKDe23TsjjX3ZmJo","metadata":{"tint":{"h":0,"s":0,"l":3},"width":1600,"height":1200}}],"post":null,"createdAt":"2025-12-01T06:35:54.348Z","updatedAt":"2026-01-03T11:02:58.296Z","publishedAt":"2025-12-09T04:00:30.860Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":null,"previewUrl":"https://full-teams-379368.framer.app/","price":"5","paymentUrl":"https://harman-design.lemonsqueezy.com/buy/3b31bd9a-d4f7-4b08-8833-aa83624ee379","workshop":true,"categories":[{"id":"b42eea44-0ea9-4372-9981-70c9e68577c1","name":"Loaders","slug":"loaders"}],"lastSaveId":"y1ZWJddBRqkUUbq4uFcZ","tags":[]}}],"contests":[],"categories":[],"tags":[],"likes":{"count":1,"liked":false},"comments":{"count":0},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2025-12-09T04:00:30.860Z","updatedAt":"2025-12-09T04:00:30.860Z"},{"id":"019b013f-27e9-763e-8172-8b9229bda8da","title":null,"body":null,"bodyJson":null,"author":{"framerUserId":"d0b6aa04-ee5a-4991-9949-9ab840bfebac","name":"RAMDIN SINGH","slug":"ramdin-singh","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1332055/avatar-RQRwIx1ftH09YkE4bNvMYkX0Z9V2HX.jpg","followed":false,"followsYou":false},"media":[],"resources":[{"id":"AoWXqFMXcJWyo14I6qeq","resolved":true,"title":"Shader 3D Background","body":"$5e","bodyJson":null,"introduction":"","slug":"shader-3d-background","author":{"framerUserId":"d0b6aa04-ee5a-4991-9949-9ab840bfebac","name":"RAMDIN SINGH","slug":"ramdin-singh","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1332055/avatar-RQRwIx1ftH09YkE4bNvMYkX0Z9V2HX.jpg","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/AoWXqFMXcJWyo14I6qeq/shader-3d-background-o9ipwNYCNCyShVTSlfHXT2dcJiupj7","metadata":{"tint":{"h":0,"s":0,"l":3},"width":1600,"height":1200}}],"post":null,"createdAt":"2025-12-02T09:21:37.222Z","updatedAt":"2026-01-03T11:02:52.477Z","publishedAt":"2025-12-09T03:54:34.857Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":null,"previewUrl":"https://agreeable-skills-021990.framer.app/","price":"5","paymentUrl":"https://harman-design.lemonsqueezy.com/buy/a542b491-962c-4a37-a91a-a6ccc23bc568","workshop":true,"categories":[{"id":"1a3a0eb3-698e-461a-bf42-2502a7ed43e0","name":"Backgrounds","slug":"backgrounds"}],"lastSaveId":"I3fGAt6ZIX4wDXS0uzle","tags":[]}}],"contests":[],"categories":[],"tags":[],"likes":{"count":1,"liked":false},"comments":{"count":0},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2025-12-09T03:54:34.857Z","updatedAt":"2025-12-09T03:54:34.857Z"},{"id":"019af1d9-3e69-7bc7-8b12-c063340517be","title":null,"body":null,"bodyJson":null,"author":{"framerUserId":"d0b6aa04-ee5a-4991-9949-9ab840bfebac","name":"RAMDIN SINGH","slug":"ramdin-singh","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1332055/avatar-RQRwIx1ftH09YkE4bNvMYkX0Z9V2HX.jpg","followed":false,"followsYou":false},"media":[],"resources":[{"id":"V3HpzAQPrSUp768hJELX","resolved":true,"title":"Gradient Shapes Grid","body":"

Description (Clear & Professional)

This Framer component renders a dynamic grid of colorful, animated conic-gradient shapes. Each shape rotates smoothly using auto-generated CSS keyframes and scales, fades, and animates based on its position in the sequence. The entire animation is fully customizable through Framer property controls, allowing you to adjust the number of shapes, size, animation duration, scale factor, delay staggering, border radius, and gradient colors.

The component intelligently manages browser-only APIs, supports thumbnail rendering, and cleans up injected styles to ensure stable behavior inside Framer. Ideal for creating vibrant hero sections, abstract backgrounds, or layered animated visuals in modern web designs.

","bodyJson":null,"introduction":"","slug":"control-panel","author":{"framerUserId":"d0b6aa04-ee5a-4991-9949-9ab840bfebac","name":"RAMDIN SINGH","slug":"ramdin-singh","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1332055/avatar-RQRwIx1ftH09YkE4bNvMYkX0Z9V2HX.jpg","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/V3HpzAQPrSUp768hJELX/control-panel-jUVZb9y5dnvxiVP49b8HamcvgbqILf","metadata":{"tint":{"h":0,"s":0,"l":57},"width":1600,"height":1200}}],"post":null,"createdAt":"2025-11-26T10:43:45.927Z","updatedAt":"2026-01-03T11:02:43.096Z","publishedAt":"2025-12-06T04:08:57.705Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":null,"previewUrl":"https://flourished-ways-806973.framer.app/","price":"5","paymentUrl":"https://harman-design.lemonsqueezy.com/buy/8564815d-bbba-4f1c-b922-895fd818b074","workshop":true,"categories":[{"id":"5c50a4d9-4405-49ca-8956-4909a204480d","name":"Sections","slug":"sections"}],"lastSaveId":"Q8e2oLqDT3HoQpvu96lv","tags":[]}}],"contests":[],"categories":[],"tags":[],"likes":{"count":1,"liked":false},"comments":{"count":0},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2025-12-06T04:08:57.705Z","updatedAt":"2025-12-06T04:08:57.705Z"},{"id":"019ac9c7-5a50-7e65-91a6-a17bac003958","title":null,"body":null,"bodyJson":null,"author":{"framerUserId":"d0b6aa04-ee5a-4991-9949-9ab840bfebac","name":"RAMDIN SINGH","slug":"ramdin-singh","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1332055/avatar-RQRwIx1ftH09YkE4bNvMYkX0Z9V2HX.jpg","followed":false,"followsYou":false},"media":[],"resources":[{"id":"aNjmbqSzpRdbDnTw61s2","resolved":true,"title":"Black_Hole_Blaster","body":"

Description

This Framer component renders a fully dynamic, canvas-powered black hole visualization featuring thousands of orbiting stars, smooth rotational physics, atmospheric trails, and interactive collapse/expansion animations. The animation reacts to mouse hover, click, and Enter-button activation, creating a cinematic space-warp experience.

The system simulates 2500+ particles orbiting a central point, each with randomized orbital distances, angular velocities, and trail paths that blend together using multiply blending for a soft, nebula-like effect. Users can hover over the center button to trigger a subtle gravitational \"collapse\" effect, and click to initiate an expanse sequence — stars stretch outward, then eventually return to their natural orbits.

","bodyJson":null,"introduction":"","slug":"black-hole-blaster","author":{"framerUserId":"d0b6aa04-ee5a-4991-9949-9ab840bfebac","name":"RAMDIN SINGH","slug":"ramdin-singh","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1332055/avatar-RQRwIx1ftH09YkE4bNvMYkX0Z9V2HX.jpg","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/aNjmbqSzpRdbDnTw61s2/black-hole-blaster-zDzGAPhbeogScbKS17q3OVp2bMUCRR","metadata":{"tint":{"h":0,"s":0,"l":3},"width":1600,"height":1200}}],"post":null,"createdAt":"2025-11-23T11:24:58.548Z","updatedAt":"2026-01-03T11:02:09.148Z","publishedAt":"2025-11-28T09:24:36.560Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":null,"previewUrl":"https://thriving-intend-085773.framer.app/","price":"5","paymentUrl":"https://harman-design.lemonsqueezy.com/buy/4a2e304b-025a-4bdd-886b-2148809be5dc","workshop":true,"categories":[{"id":"cd81cc33-d6cf-4630-8e59-b5b3100166ba","name":"Buttons","slug":"buttons"}],"lastSaveId":"J1PZbzZFZDIlRU7DoWfV","tags":[]}}],"contests":[],"categories":[],"tags":[],"likes":{"count":1,"liked":false},"comments":{"count":0},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2025-11-28T09:24:36.560Z","updatedAt":"2025-11-28T09:24:36.560Z"},{"id":"019abaae-db10-72b7-a60f-14dbea3d5a05","title":null,"body":null,"bodyJson":null,"author":{"framerUserId":"d0b6aa04-ee5a-4991-9949-9ab840bfebac","name":"RAMDIN SINGH","slug":"ramdin-singh","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1332055/avatar-RQRwIx1ftH09YkE4bNvMYkX0Z9V2HX.jpg","followed":false,"followsYou":false},"media":[],"resources":[{"id":"bwF4T9cI3DQZaipUIOA6","resolved":true,"title":"Grid Ripple","body":"

Description

This Framer component renders a fully dynamic grid-ripple animation using an HTML canvas. Each cell in the grid scales, shifts, and animates outward in a ripple-like motion based on distance from the center, easing curves, and wave-phase timing. The component is highly configurable—allowing you to adjust grid density, animation speed, line styling, color themes, easing functions, and more.

Optimized for responsiveness and performance, the effect scales to any layout size and automatically reduces to a static render in Framer’s canvas or when out of view. Perfect for hero sections, tech-themed backgrounds, motion UI experiments, or subtle animated textures.

","bodyJson":null,"introduction":"","slug":"grid-ripple","author":{"framerUserId":"d0b6aa04-ee5a-4991-9949-9ab840bfebac","name":"RAMDIN SINGH","slug":"ramdin-singh","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1332055/avatar-RQRwIx1ftH09YkE4bNvMYkX0Z9V2HX.jpg","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/bwF4T9cI3DQZaipUIOA6/grid-ripple-Z1rMaH5NVvIqiI7eznixL59wbydMUP","metadata":{"tint":{"h":0,"s":0,"l":3},"width":1600,"height":1200}}],"post":null,"createdAt":"2025-11-22T08:59:59.268Z","updatedAt":"2026-01-03T11:02:03.194Z","publishedAt":"2025-11-25T11:03:32.880Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":null,"previewUrl":"https://soulful-report-993314.framer.app/","price":"5","paymentUrl":"https://harman-design.lemonsqueezy.com/buy/2fe8d59e-49df-461e-b56b-e087d405d725","workshop":true,"categories":[{"id":"323e97d6-f443-488c-8661-794a9a83a20f","name":"Effects","slug":"effects"}],"lastSaveId":"gRiQ9ltUsnk4FNiiK7tB","tags":[]}}],"contests":[],"categories":[],"tags":[],"likes":{"count":1,"liked":false},"comments":{"count":0},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2025-11-25T11:03:32.880Z","updatedAt":"2025-11-25T11:03:32.880Z"},{"id":"019abaaa-9aeb-7a68-bfe3-377cbb7c985c","title":null,"body":null,"bodyJson":null,"author":{"framerUserId":"d0b6aa04-ee5a-4991-9949-9ab840bfebac","name":"RAMDIN SINGH","slug":"ramdin-singh","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1332055/avatar-RQRwIx1ftH09YkE4bNvMYkX0Z9V2HX.jpg","followed":false,"followsYou":false},"media":[],"resources":[{"id":"22K7ThwldlqdNhdP8Jky","resolved":true,"title":"Animated Logo Loader","body":"$5f","bodyJson":null,"introduction":"","slug":"animated-logo-loader","author":{"framerUserId":"d0b6aa04-ee5a-4991-9949-9ab840bfebac","name":"RAMDIN SINGH","slug":"ramdin-singh","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1332055/avatar-RQRwIx1ftH09YkE4bNvMYkX0Z9V2HX.jpg","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/22K7ThwldlqdNhdP8Jky/animated-logo-loader-xZxg58QfKPYZfmjHJ11hEqBlWFxE1H","metadata":{"tint":{"h":0,"s":0,"l":3},"width":1600,"height":1200}}],"post":null,"createdAt":"2025-11-21T10:44:52.356Z","updatedAt":"2026-01-03T11:01:56.617Z","publishedAt":"2025-11-25T10:58:54.315Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":null,"previewUrl":"https://extended-author-446455.framer.app/","price":"5","paymentUrl":"https://harman-design.lemonsqueezy.com/buy/2c74f9fa-abe0-4d6c-a6d9-1c97c6edda48","workshop":true,"categories":[{"id":"b42eea44-0ea9-4372-9981-70c9e68577c1","name":"Loaders","slug":"loaders"}],"lastSaveId":"DNiZQneaRxqXcemPy2mB","tags":[]}}],"contests":[],"categories":[],"tags":[],"likes":{"count":1,"liked":false},"comments":{"count":0},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2025-11-25T10:58:54.315Z","updatedAt":"2025-11-25T10:58:54.315Z"},{"id":"019ab923-e9e7-7c8e-bedc-075d697b4802","title":null,"body":null,"bodyJson":null,"author":{"framerUserId":"d0b6aa04-ee5a-4991-9949-9ab840bfebac","name":"RAMDIN SINGH","slug":"ramdin-singh","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1332055/avatar-RQRwIx1ftH09YkE4bNvMYkX0Z9V2HX.jpg","followed":false,"followsYou":false},"media":[],"resources":[{"id":"odbOUa6u3GETSMFFTzlk","resolved":true,"title":"Motion Carousel","body":"$60","bodyJson":null,"introduction":"","slug":"motion-carousel","author":{"framerUserId":"d0b6aa04-ee5a-4991-9949-9ab840bfebac","name":"RAMDIN SINGH","slug":"ramdin-singh","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1332055/avatar-RQRwIx1ftH09YkE4bNvMYkX0Z9V2HX.jpg","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/odbOUa6u3GETSMFFTzlk/motion-carousel-UMFozcJE8qH3XTolxmFvf8S81BMeoL","metadata":{"tint":{"h":0,"s":0,"l":58},"width":1600,"height":1200}}],"post":null,"createdAt":"2025-11-08T10:34:53.727Z","updatedAt":"2026-01-03T11:01:48.698Z","publishedAt":"2025-11-25T03:52:09.959Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":null,"previewUrl":"https://relevant-tour-683706.framer.app/","price":"5","paymentUrl":"https://harman-design.lemonsqueezy.com/buy/1a8a4d27-ffad-4738-9472-974aa659bae5","workshop":true,"categories":[{"id":"8f93ccfe-423c-47f2-b8ae-79e9e132012f","name":"Carousels","slug":"carousels"}],"lastSaveId":"6qq2VF2Z9PS4VJ3o0uH6","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":"2025-11-25T03:52:09.959Z","updatedAt":"2025-11-25T03:52:09.959Z"},{"id":"019aa4a0-46cb-7aef-aaee-771919793c55","title":null,"body":null,"bodyJson":null,"author":{"framerUserId":"d0b6aa04-ee5a-4991-9949-9ab840bfebac","name":"RAMDIN SINGH","slug":"ramdin-singh","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1332055/avatar-RQRwIx1ftH09YkE4bNvMYkX0Z9V2HX.jpg","followed":false,"followsYou":false},"media":[],"resources":[{"id":"qEyRZaatZnA712aIQ34H","resolved":true,"title":"Generative_Animation","body":"$61","bodyJson":null,"introduction":"","slug":"generative-animation","author":{"framerUserId":"d0b6aa04-ee5a-4991-9949-9ab840bfebac","name":"RAMDIN SINGH","slug":"ramdin-singh","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1332055/avatar-RQRwIx1ftH09YkE4bNvMYkX0Z9V2HX.jpg","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/qEyRZaatZnA712aIQ34H/generative-animation-uLXaItMEkYN5IXyxhwpPtmTsny7S22","metadata":{"tint":{"h":0,"s":0,"l":58},"width":1600,"height":1200}}],"post":null,"createdAt":"2025-11-14T10:30:02.103Z","updatedAt":"2026-01-03T10:58:34.863Z","publishedAt":"2025-11-21T04:15:58.667Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":null,"previewUrl":"https://reliable-exceptions-806906.framer.app/","price":"5","paymentUrl":"https://harman-design.lemonsqueezy.com/buy/73821503-4563-4cb6-a340-d6aff9ce401a","workshop":true,"categories":[{"id":"1a3a0eb3-698e-461a-bf42-2502a7ed43e0","name":"Backgrounds","slug":"backgrounds"}],"lastSaveId":"82qWqueT7uwAEGwYLbLQ","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":"2025-11-21T04:15:58.667Z","updatedAt":"2025-11-21T04:15:58.667Z"},{"id":"019a951d-fbfc-764c-808c-99517f2aab20","title":null,"body":null,"bodyJson":null,"author":{"framerUserId":"d0b6aa04-ee5a-4991-9949-9ab840bfebac","name":"RAMDIN SINGH","slug":"ramdin-singh","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1332055/avatar-RQRwIx1ftH09YkE4bNvMYkX0Z9V2HX.jpg","followed":false,"followsYou":false},"media":[],"resources":[{"id":"EdZHvVstIfXkPaEWeBn0","resolved":true,"title":"ImageGallery3D","body":"$62","bodyJson":null,"introduction":"","slug":"imagegallery3d","author":{"framerUserId":"d0b6aa04-ee5a-4991-9949-9ab840bfebac","name":"RAMDIN SINGH","slug":"ramdin-singh","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1332055/avatar-RQRwIx1ftH09YkE4bNvMYkX0Z9V2HX.jpg","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/EdZHvVstIfXkPaEWeBn0/imagegallery3d-mpAYWMKmICzPxJ23JnmFbwrQkYQO1C","metadata":{"tint":{"h":0,"s":0,"l":58},"width":1600,"height":1200}}],"post":null,"createdAt":"2025-11-04T09:44:56.647Z","updatedAt":"2026-01-03T10:58:23.803Z","publishedAt":"2025-11-18T03:59:21.596Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":null,"previewUrl":"https://overly-fade-967314.framer.app/","price":"5","paymentUrl":"https://harman-design.lemonsqueezy.com/buy/8b34d376-fa42-458b-a879-88a86754d999","workshop":true,"categories":[{"id":"66bb31f7-cddf-4a3e-8604-95b3467aecc2","name":"Galleries","slug":"galleries"}],"lastSaveId":"Akl0Gq9UBIynEx1JoBGv","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":"2025-11-18T03:59:21.596Z","updatedAt":"2025-11-18T03:59:21.596Z"},{"id":"019a6de7-62bf-745b-a978-acb2409d3ee4","title":null,"body":null,"bodyJson":null,"author":{"framerUserId":"d0b6aa04-ee5a-4991-9949-9ab840bfebac","name":"RAMDIN SINGH","slug":"ramdin-singh","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1332055/avatar-RQRwIx1ftH09YkE4bNvMYkX0Z9V2HX.jpg","followed":false,"followsYou":false},"media":[],"resources":[{"id":"5mY6tuFN1p0c4rP4l4Bz","resolved":true,"title":"Animated_Pixel_Grid","body":"$63","bodyJson":null,"introduction":"","slug":"animated-pixel-grid","author":{"framerUserId":"d0b6aa04-ee5a-4991-9949-9ab840bfebac","name":"RAMDIN SINGH","slug":"ramdin-singh","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1332055/avatar-RQRwIx1ftH09YkE4bNvMYkX0Z9V2HX.jpg","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/5mY6tuFN1p0c4rP4l4Bz/animated-pixel-grid-c5uyaWTeu9YqtTVU0qwypFOBsLggHa","metadata":{"tint":{"h":0,"s":0,"l":58},"width":1600,"height":1200}}],"post":null,"createdAt":"2025-11-01T06:30:27.721Z","updatedAt":"2026-01-03T10:58:42.409Z","publishedAt":"2025-11-10T13:14:31.999Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":null,"previewUrl":"https://jolly-overlay-715237.framer.app/","price":"5","paymentUrl":"https://harman-design.lemonsqueezy.com/buy/382c2a7a-3953-41d1-a9a9-294394875504","workshop":true,"categories":[{"id":"1a3a0eb3-698e-461a-bf42-2502a7ed43e0","name":"Backgrounds","slug":"backgrounds"}],"lastSaveId":"mIAzVX1yLNwABcbWv6G3","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":"2025-11-10T13:14:31.999Z","updatedAt":"2025-11-10T13:14:31.999Z"},{"id":"019a574c-7f82-75f8-85a7-79498ee659af","title":null,"body":null,"bodyJson":null,"author":{"framerUserId":"d0b6aa04-ee5a-4991-9949-9ab840bfebac","name":"RAMDIN SINGH","slug":"ramdin-singh","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1332055/avatar-RQRwIx1ftH09YkE4bNvMYkX0Z9V2HX.jpg","followed":false,"followsYou":false},"media":[],"resources":[{"id":"pH7x49kpsCKlpmkLjEaU","resolved":true,"title":"Active_Image_Gallery","body":"$64","bodyJson":null,"introduction":"","slug":"active-image-gallery","author":{"framerUserId":"d0b6aa04-ee5a-4991-9949-9ab840bfebac","name":"RAMDIN SINGH","slug":"ramdin-singh","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1332055/avatar-RQRwIx1ftH09YkE4bNvMYkX0Z9V2HX.jpg","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/pH7x49kpsCKlpmkLjEaU/active-image-gallery-KBiM2THA6kir4g1VAimQyppgZWY8Dz","metadata":{"tint":{"h":0,"s":0,"l":58},"width":1600,"height":1200}}],"post":null,"createdAt":"2025-10-27T09:24:03.791Z","updatedAt":"2026-01-03T10:58:15.240Z","publishedAt":"2025-11-06T03:53:42.530Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":null,"previewUrl":"https://ancient-copywriter-445786.framer.app/","price":"5","paymentUrl":"https://harman-design.lemonsqueezy.com/buy/33a1c0d0-0abf-430a-99bd-77386af642cb","workshop":true,"categories":[{"id":"66bb31f7-cddf-4a3e-8604-95b3467aecc2","name":"Galleries","slug":"galleries"}],"lastSaveId":"XNRENlvFW8zOOVC6HUWA","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":"2025-11-06T03:53:42.530Z","updatedAt":"2025-11-06T03:53:42.530Z"},{"id":"019a4e9b-7c58-721b-8e6f-5ac40a8eb6ad","title":null,"body":null,"bodyJson":null,"author":{"framerUserId":"d0b6aa04-ee5a-4991-9949-9ab840bfebac","name":"RAMDIN SINGH","slug":"ramdin-singh","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1332055/avatar-RQRwIx1ftH09YkE4bNvMYkX0Z9V2HX.jpg","followed":false,"followsYou":false},"media":[],"resources":[{"id":"iRlw0cLdNl8Ll2FE13VB","resolved":true,"title":"Text_Shadow","body":"$65","bodyJson":null,"introduction":"","slug":"text-shadow","author":{"framerUserId":"d0b6aa04-ee5a-4991-9949-9ab840bfebac","name":"RAMDIN SINGH","slug":"ramdin-singh","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1332055/avatar-RQRwIx1ftH09YkE4bNvMYkX0Z9V2HX.jpg","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/iRlw0cLdNl8Ll2FE13VB/text-shadow-jKDJhZqdFflXTzJyh7xrUjpCYLFIT1","metadata":{"tint":{"h":0,"s":0,"l":57},"width":1600,"height":1200}}],"post":null,"createdAt":"2025-10-25T09:18:23.748Z","updatedAt":"2026-01-03T11:02:22.590Z","publishedAt":"2025-11-04T11:23:24.120Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":null,"previewUrl":"https://necessary-minimalist-847255.framer.app/","price":"5","paymentUrl":"https://harman-design.lemonsqueezy.com/buy/1acce01f-eb47-41bf-a674-988590e1bc72","workshop":true,"categories":[{"id":"7fe42fdd-1b16-4f5a-93b8-009488614de8","name":"Text","slug":"text"}],"lastSaveId":"VLhQ9I6WeOLbyKfky6Cs","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":"2025-11-04T11:23:24.120Z","updatedAt":"2025-11-04T11:23:24.120Z"},{"id":"019a4e97-6aef-7952-a5ec-13487484d378","title":null,"body":null,"bodyJson":null,"author":{"framerUserId":"d0b6aa04-ee5a-4991-9949-9ab840bfebac","name":"RAMDIN SINGH","slug":"ramdin-singh","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1332055/avatar-RQRwIx1ftH09YkE4bNvMYkX0Z9V2HX.jpg","followed":false,"followsYou":false},"media":[],"resources":[{"id":"W6fw5LRZUuiqc16Gci93","resolved":true,"title":"FxGallery Image","body":"$66","bodyJson":null,"introduction":"","slug":"fxgallery-image","author":{"framerUserId":"d0b6aa04-ee5a-4991-9949-9ab840bfebac","name":"RAMDIN SINGH","slug":"ramdin-singh","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1332055/avatar-RQRwIx1ftH09YkE4bNvMYkX0Z9V2HX.jpg","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/W6fw5LRZUuiqc16Gci93/fx-gallery-image-IJ0JBOlvB7umeocfhcgi23QMdS1WLm","metadata":{"tint":{"h":0,"s":0,"l":58},"width":1600,"height":1200}}],"post":null,"createdAt":"2025-10-23T04:37:03.223Z","updatedAt":"2026-01-03T10:58:50.388Z","publishedAt":"2025-11-04T11:18:57.519Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":null,"previewUrl":"https://desirable-attributes-325443.framer.app/","price":"5","paymentUrl":"https://harman-design.lemonsqueezy.com/buy/e454bd7d-7c4d-4413-9392-93f9cb39af09","workshop":true,"categories":[{"id":"66bb31f7-cddf-4a3e-8604-95b3467aecc2","name":"Galleries","slug":"galleries"}],"lastSaveId":"S4cfrbmAsZT2ElAwJ6kY","tags":[]}}],"contests":[],"categories":[],"tags":[],"likes":{"count":1,"liked":false},"comments":{"count":0},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2025-11-04T11:18:57.519Z","updatedAt":"2025-11-04T11:18:57.519Z"},{"id":"019a4984-9190-7d1c-8695-40b7a220acbd","title":null,"body":null,"bodyJson":null,"author":{"framerUserId":"d0b6aa04-ee5a-4991-9949-9ab840bfebac","name":"RAMDIN SINGH","slug":"ramdin-singh","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1332055/avatar-RQRwIx1ftH09YkE4bNvMYkX0Z9V2HX.jpg","followed":false,"followsYou":false},"media":[],"resources":[{"id":"MWyo2QxrOyPhVfBq3BCc","resolved":true,"title":"InteractiveCardStack","body":"

Description:

This interactive 3D card layout creates a futuristic and dynamic hover effect for character profiles. Each card represents a unique cyber-themed persona, featuring animated scaling, rotation, and depth transitions that react smoothly to user hover. The central card comes into focus while surrounding cards tilt and fade to the background, simulating a 3D stacking illusion.

Every profile card includes a character name, alias, and avatar image, along with an animated heart button that reacts with a glowing hover pulse. The layout uses modern CSS variables for scalable control of transformations and colors, and a simple JavaScript event listener to manage active and inactive card states.

Perfect for gaming profiles, portfolio displays, team showcases, or futuristic UI dashboards, this design blends motion, symmetry, and interactivity into a visually striking experience.

","bodyJson":null,"introduction":"","slug":"new-card-stack","author":{"framerUserId":"d0b6aa04-ee5a-4991-9949-9ab840bfebac","name":"RAMDIN SINGH","slug":"ramdin-singh","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1332055/avatar-RQRwIx1ftH09YkE4bNvMYkX0Z9V2HX.jpg","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/MWyo2QxrOyPhVfBq3BCc/interactivecardstack-8TDmy5EKfkPoNTADerI9msBYYq3ply","metadata":{"tint":{"h":0,"s":0,"l":58},"width":1600,"height":1200}}],"post":null,"createdAt":"2025-10-20T04:24:12.356Z","updatedAt":"2026-01-03T10:58:07.900Z","publishedAt":"2025-11-03T11:40:16.144Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":null,"previewUrl":"https://only-tests-502649.framer.app/","price":"5","paymentUrl":"https://harman-design.lemonsqueezy.com/buy/9dc1f616-6574-4895-9599-7fdae1c25f20","workshop":true,"categories":[{"id":"c3e183d1-597a-4479-8a6f-244ae3c96f40","name":"Cards","slug":"cards"}],"lastSaveId":"Zh5xriExW19o3gHLn9kW","tags":[]}}],"contests":[],"categories":[],"tags":[],"likes":{"count":1,"liked":false},"comments":{"count":0},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2025-11-03T11:40:16.144Z","updatedAt":"2025-11-03T11:40:16.144Z"},{"id":"019a3857-91cb-720a-81ba-5712041a295c","title":null,"body":null,"bodyJson":null,"author":{"framerUserId":"d0b6aa04-ee5a-4991-9949-9ab840bfebac","name":"RAMDIN SINGH","slug":"ramdin-singh","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1332055/avatar-RQRwIx1ftH09YkE4bNvMYkX0Z9V2HX.jpg","followed":false,"followsYou":false},"media":[],"resources":[{"id":"V6R0pHsAzHUy0eMGhFPq","resolved":true,"title":"Distortion Image","body":"$67","bodyJson":null,"introduction":"","slug":"distortion-image","author":{"framerUserId":"d0b6aa04-ee5a-4991-9949-9ab840bfebac","name":"RAMDIN SINGH","slug":"ramdin-singh","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1332055/avatar-RQRwIx1ftH09YkE4bNvMYkX0Z9V2HX.jpg","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/V6R0pHsAzHUy0eMGhFPq/image-distortion-tHjFdjH8A45LEOS6IRXFiHeTcP6ujS","metadata":{"tint":{"h":0,"s":0,"l":16},"width":1600,"height":1200}}],"post":null,"createdAt":"2025-10-20T05:11:47.884Z","updatedAt":"2026-01-03T10:58:00.117Z","publishedAt":"2025-10-31T03:37:34.411Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":null,"previewUrl":"https://clear-minimalist-509171.framer.app/","price":"5","paymentUrl":"https://harman-design.lemonsqueezy.com/buy/ff3b01f8-5711-4bb8-8805-8211ca60cb59","workshop":true,"categories":[{"id":"323e97d6-f443-488c-8661-794a9a83a20f","name":"Effects","slug":"effects"}],"lastSaveId":"nQVvsxF5y9Mkcr1RTf5P","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":"2025-10-31T03:37:34.411Z","updatedAt":"2025-10-31T03:37:34.411Z"},{"id":"019a3851-4b64-7d08-a405-846c3b9b971a","title":null,"body":null,"bodyJson":null,"author":{"framerUserId":"d0b6aa04-ee5a-4991-9949-9ab840bfebac","name":"RAMDIN SINGH","slug":"ramdin-singh","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1332055/avatar-RQRwIx1ftH09YkE4bNvMYkX0Z9V2HX.jpg","followed":false,"followsYou":false},"media":[],"resources":[{"id":"sccjhzzqWLVw9vDQYYCL","resolved":true,"title":"Waves of Code","body":"

Description:This mesmerizing canvas-based animation transforms the word “SIMBA” into a living, breathing waveform. Each letter ripples dynamically with circular wave distortions, creating the illusion of energy pulsing through the text.

The effect blends mathematical precision with artistic motion — generated entirely through JavaScript and HTML Canvas APIs. By analyzing pixel data from a hidden text mask, it differentiates the inside and outside of the text, applying vibrant magenta and cyan strokes that shimmer across a deep, galactic gradient background.

The result is a hypnotic blend of geometry, color, and fluid animation, representing how code itself can become art.

🎨 A tribute to creative coding — where mathematics meets motion design.

","bodyJson":null,"introduction":"","slug":"waves-of-code","author":{"framerUserId":"d0b6aa04-ee5a-4991-9949-9ab840bfebac","name":"RAMDIN SINGH","slug":"ramdin-singh","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1332055/avatar-RQRwIx1ftH09YkE4bNvMYkX0Z9V2HX.jpg","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/sccjhzzqWLVw9vDQYYCL/waves-of-code-nk6EeNaq2Sf7aHimuTgMRTC2M8sDke","metadata":{"tint":{"h":0,"s":0,"l":58},"width":1600,"height":1200}}],"post":null,"createdAt":"2025-10-21T11:42:04.074Z","updatedAt":"2026-01-03T10:59:07.588Z","publishedAt":"2025-10-31T03:30:43.172Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":null,"previewUrl":"https://social-interaction-249045.framer.app/","price":"5","paymentUrl":"https://harman-design.lemonsqueezy.com/buy/e4428d22-2a88-4d98-a445-b4199104f2ce","workshop":true,"categories":[{"id":"7fe42fdd-1b16-4f5a-93b8-009488614de8","name":"Text","slug":"text"}],"lastSaveId":"JiF3EZ2S3A6cxeTZ9D8L","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":"2025-10-31T03:30:43.172Z","updatedAt":"2025-10-31T03:30:43.172Z"},{"id":"019a343f-a028-7beb-b1dd-75a857d8c668","title":null,"body":null,"bodyJson":null,"author":{"framerUserId":"d0b6aa04-ee5a-4991-9949-9ab840bfebac","name":"RAMDIN SINGH","slug":"ramdin-singh","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1332055/avatar-RQRwIx1ftH09YkE4bNvMYkX0Z9V2HX.jpg","followed":false,"followsYou":false},"media":[],"resources":[{"id":"YLBFI60r4nrIw1w2NLXq","resolved":true,"title":"Wave_Thread","body":"$68","bodyJson":null,"introduction":"","slug":"wave-thread","author":{"framerUserId":"d0b6aa04-ee5a-4991-9949-9ab840bfebac","name":"RAMDIN SINGH","slug":"ramdin-singh","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1332055/avatar-RQRwIx1ftH09YkE4bNvMYkX0Z9V2HX.jpg","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/YLBFI60r4nrIw1w2NLXq/wave-thread-l1CBKXeMtcKWiOkkuBLuFMxs5bXdce","metadata":{"tint":{"h":0,"s":0,"l":57},"width":1600,"height":1200}}],"post":null,"createdAt":"2025-10-22T09:47:03.823Z","updatedAt":"2026-01-03T10:59:16.349Z","publishedAt":"2025-10-30T08:32:56.360Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":null,"previewUrl":"https://mobile-updates-908866.framer.app/","price":"5","paymentUrl":"https://harman-design.lemonsqueezy.com/buy/f9e50d99-2122-406f-bfec-314b451611fa","workshop":true,"categories":[{"id":"323e97d6-f443-488c-8661-794a9a83a20f","name":"Effects","slug":"effects"}],"lastSaveId":"KUmwRF2LMlXF0GQ4wvJU","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":"2025-10-30T08:32:56.360Z","updatedAt":"2025-10-30T08:32:56.360Z"},{"id":"019a2e65-0a4e-75b0-86e9-f5d50b085880","title":null,"body":null,"bodyJson":null,"author":{"framerUserId":"d0b6aa04-ee5a-4991-9949-9ab840bfebac","name":"RAMDIN SINGH","slug":"ramdin-singh","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1332055/avatar-RQRwIx1ftH09YkE4bNvMYkX0Z9V2HX.jpg","followed":false,"followsYou":false},"media":[],"resources":[{"id":"jk7HEQg9wWR0wRUKpRjM","resolved":true,"title":"Carousel 3D Framer","body":"$69","bodyJson":null,"introduction":"","slug":"carousel-3d-framer","author":{"framerUserId":"d0b6aa04-ee5a-4991-9949-9ab840bfebac","name":"RAMDIN SINGH","slug":"ramdin-singh","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1332055/avatar-RQRwIx1ftH09YkE4bNvMYkX0Z9V2HX.jpg","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/jk7HEQg9wWR0wRUKpRjM/interactive-3d-image-3WoWAkCDGPNxX0r2QFUDUvXgTfFft9","metadata":{"tint":{"h":240,"s":50,"l":6},"width":1600,"height":1200}}],"post":null,"createdAt":"2025-10-14T03:49:01.604Z","updatedAt":"2026-01-03T10:57:53.194Z","publishedAt":"2025-10-29T05:16:05.070Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":null,"previewUrl":"https://sensational-prism-664490.framer.app/","price":"5","paymentUrl":"https://harman-design.lemonsqueezy.com/buy/3f17f45d-fca8-4fda-8b72-32feb8bf0600","workshop":true,"categories":[{"id":"8f93ccfe-423c-47f2-b8ae-79e9e132012f","name":"Carousels","slug":"carousels"}],"lastSaveId":"NM1X1oqttvl8hKSDyKn6","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":"2025-10-29T05:16:05.070Z","updatedAt":"2025-10-29T05:16:05.070Z"}],"pagination":{"next":"MDE5YTJlNjUtMGE0ZS03NWIwLTg2ZTktZjVkNTBiMDg1ODgw","previous":null},"totalCount":"$undefined","feedSession":"$undefined"}]}},"children":"$L6a"}]