https://framer.com/m/Gradientstripsbg-WHwTXj.js
Io / Enhancements / GradientStripsBG
GradientStripsBG
GradientStripsBG fills a section with bands of gradient, arranged and animated through grouped controls rather than a long flat list.
Examples
Live specimens for every control the component exposes.
Setup
Five groups carry everything: content for what the strips hold, layout for how they are arranged, style for their colours, states for how they respond, and advanced for the rest. The controls toggle exposes an on-canvas panel while you tune it.
Props
The controls exposed on the instance panel.
Usage
Guidance carried over from the component definition.
Reach for GradientStripsBG
A section needs a built background rather than a flat fill.
The bands should carry brand gradients.
You want to tune it on the canvas rather than in code.
The bands should be tuned by eye rather than by numbers alone.
Reach for something else
A single gradient fill on the frame would do.
The background must follow theme tokens — this paints its own colours.
You need a shader wash — use FluidShaderBackground.
Io — Enhancements
Every specimen above is a live component instance. Colour, type and radius resolve from the project theme tokens.