Component
Hover Chroma Backgrounds in Framer
Created by
About the resource
Using the component is really simple. Just paste it into your Framer project and position it as a background layer. It works on both black and white backgrounds.
To position it as a background, I usually set it to absolute positioning and activate pins on all sides, setting them to 0, so it always takes up the full width and height of its parent frame.
About the resource
Using the component is really simple. Just paste it into your Framer project and position it as a background layer. It works on both black and white backgrounds.
To position it as a background, I usually set it to absolute positioning and activate pins on all sides, setting them to 0, so it always takes up the full width and height of its parent frame.
About the resource
Using the component is really simple. Just paste it into your Framer project and position it as a background layer. It works on both black and white backgrounds.
To position it as a background, I usually set it to absolute positioning and activate pins on all sides, setting them to 0, so it always takes up the full width and height of its parent frame.
Absolute positioning with layout pins.
Absolute positioning with layout pins.
Absolute positioning with layout pins.
To make sure it is below the content on your site, you can play with the z-index (which can be added to the element in the right panel under styles) or adjust the ordering in the layers panel.
Component properties
The component has a "Style" property, where you can switch between different types of effects (Liquid, Folds, Smoke, Flow, Pixel, ASCII). Pick the one you like the most!
To make sure it is below the content on your site, you can play with the z-index (which can be added to the element in the right panel under styles) or adjust the ordering in the layers panel.
Component properties
The component has a "Style" property, where you can switch between different types of effects (Liquid, Folds, Smoke, Flow, Pixel, ASCII). Pick the one you like the most!
To make sure it is below the content on your site, you can play with the z-index (which can be added to the element in the right panel under styles) or adjust the ordering in the layers panel.
Component properties
The component has a "Style" property, where you can switch between different types of effects (Liquid, Folds, Smoke, Flow, Pixel, ASCII). Pick the one you like the most!
Chroma background styles in Framer.
Chroma background styles in Framer.
Chroma background styles in Framer.
