Ridgeline

Show Preview
Ridgeline
Ridgeline

About Ridgeline

Ridgeline is a live 3D wireframe landscape for your Framer site. It drifts slowly over glowing ridges and valleys, with a bright scan line sweeping across the terrain. It's the kind of background that makes a landing page feel like a product, not a template.

Move your cursor over it and the camera leans and glides with you. It's a small touch, and visitors tend to notice it.

Everything is set from the Properties panel. No code needed.

What you can change

  • Background, line and accent colors (Framer color styles work too)

  • Density: from a loose, airy grid to a fine mesh

  • Relief: flat plains or tall mountains

  • Camera height and fog distance

  • Flight speed

  • Scan pulse: on or off, and how fast it moves

  • Pointer steering strength

Good to know

  • Runs on WebGL, so it stays sharp at any size

  • Fills whatever frame you put it in, so it works as a full-page hero background or a smaller section

  • Pauses when it scrolls out of view to save battery

  • Shows a still frame for visitors who have "reduce motion" turned on

  • Stays static on the Framer canvas, so your editor doesn't slow down

Great for SaaS and AI landing pages, developer tools, crypto and web3 sites, game studios, music and event pages, and portfolios that want a strong first screen.

Tip: Put your headline over it, keep the lines at a lower opacity, and let the accent color do the work.