Hex Glass

Hex Glass is a live background for heroes, sections or a whole site. Soft light moves behind glass, and every cell bends it a little, like looking through a frosted window. It runs on the graphics card, follows the mouse and pauses when it is off screen. Drop it on the canvas, set it to fill, put your text on top. No code.

Shapes:

• Hexagons, squares or ribs (fluted glass)

Colour:

• Background and Glow. Link Glow to your brand colour style and the whole background follows it.

• Auto shades: the two in-between colours are mixed for you, or turn it off and pick all four yourself.

Glass and light:

• Strength (lower it behind long text), Cell size, Refraction, Glow shape (calm blobs or flowing liquid light)

• Light, Irregular (even or wobbly cells), Bevel, Shine, Seams

• Speed, Mouse (how much it follows the pointer), Grain, Vignette, corner Radius

Good to know:

• One WebGL canvas, no libraries. It only draws while it is on screen.

• The Framer canvas shows a still frame; it moves in Preview and on your site.

• Visitors who turn on "reduce motion" see a still frame. Without WebGL it falls back to a soft gradient in your colours.

• Also included in the Hexwall template.

Want to try it first? Hex Glass Lite is free: https://www.framer.com/marketplace/components/hex-glass-lite/