Resources

Shimmer Grid Component in Framer

View demo

Copy component

Remix project

Copy component

Remix project

Resources

Shimmer Grid Component in Framer

View demo

Copy component

Remix project

Nandi Muzsik

How can I improve Framer Uni?

Let me know if there’s a missing feature or something that could be improved.

Share feedback

How I made $10K+ with Framer in 60 days

Get your FREE ticket

$10k Undercover Event

Get your FREE ticket

Component

Shimmer Grid Component in Framer

This is a customizable shimmer grid component for Framer, inspired by Mousymusic's request. With seven built-in patterns and full customization options in the right panel, this component lets you experiment and enhance your website designs with stunning visual effects.

image of Nandi Muzsik
image of Isaac Roberts
image of Prianca S.

Created by

Nandi

,

Isaac

,

and

Prianca

Digital interface showcasing 'Shimmer Grid COMP' with a light blue dot matrix on a dark background, highlighting a UI component for web design

About the resource

To use the shimmer grid component, simply paste it into your Framer project and set it as a background layer. You can choose from seven built-in patterns or upload your own image for a custom look.

The component offers extensive customization options: adjust pattern and hover colors, set hover size in pixels, and choose between a smooth glow or circle hover effect. Fine-tune your design by controlling image sizing, position, and transparency through alpha or luminance mask modes. Complete your perfect layout by adjusting the tile size and radius.

About the resource

To use the shimmer grid component, simply paste it into your Framer project and set it as a background layer. You can choose from seven built-in patterns or upload your own image for a custom look.

The component offers extensive customization options: adjust pattern and hover colors, set hover size in pixels, and choose between a smooth glow or circle hover effect. Fine-tune your design by controlling image sizing, position, and transparency through alpha or luminance mask modes. Complete your perfect layout by adjusting the tile size and radius.

About the resource

To use the shimmer grid component, simply paste it into your Framer project and set it as a background layer. You can choose from seven built-in patterns or upload your own image for a custom look.

The component offers extensive customization options: adjust pattern and hover colors, set hover size in pixels, and choose between a smooth glow or circle hover effect. Fine-tune your design by controlling image sizing, position, and transparency through alpha or luminance mask modes. Complete your perfect layout by adjusting the tile size and radius.

Settings panel for 'Shimmer Grid' component with options for color, hover color, size, and pattern on a dark user interface background

The shimmer grid component properties in Framer.

Settings panel for 'Shimmer Grid' component with options for color, hover color, size, and pattern on a dark user interface background

The shimmer grid component properties in Framer.

Settings panel for 'Shimmer Grid' component with options for color, hover color, size, and pattern on a dark user interface background

The shimmer grid component properties in Framer.

Learn how I went from 0 to $11.5k with Framer in 60 days.

From no followers, no portfolio, no reputation, to secretly building a profitable Framer business.

Get your FREE ticket

Nandi portrait's background

Learn how I went from 0 to $11.5k with Framer in 60 days.

From no followers, no portfolio, no reputation, to secretly building a profitable Framer business.

Get your FREE ticket

Nandi portrait's background

Learn how I went from 0 to $11.5k with Framer in 60 days.

From no followers, no portfolio, no reputation, to secretly building a profitable Framer business.

Get your FREE ticket

Nandi portrait's background

More resources

More resources

View all

  • Music app playlist created screen with artist avatars

    Playlist Generation Circular Animation in Framer

    Component

    Music app playlist created screen with artist avatars

    Playlist Generation Circular Animation in Framer

    Component

  • Customer testimonials section with review letter card

    3D Letter Testimonials in Framer

    Component

    Customer testimonials section with review letter card

    3D Letter Testimonials in Framer

    Component