Lumen Roof

Overview

Lumen Roof is a full-viewport solar marketing hero by SonoJS. Built as a single HTML page with Instrument Sans, layered WebP skies/grounds/house cuts, and a WebGL fog canvas. A glass Morning / Night toggle crossfades the scene and ink colors while the headline promises $0 Electricity Bills for the next 7 Years. Nav, Get an Instant Quote CTA, and Smart Controller caption complete the chrome. prefers-reduced-motion softens the blend. Demo UI only - no backend. Open index.html or host the folder statically on Cloudflare Workers.

Highlights

1. 01

   Morning / Night toggle

   One control crossfades sky, ground, house cutouts, and UI ink between day and dusk.

2. 02

   Layered solar scene

   Blurred sky, masked ground, farmhouse with panels, tilt blur, and WebGL fog.

3. 03

   Zero-bill pitch

   $0 Electricity Bills for 7 Years plus Smart Controller caption and quote CTA.

4. 04

   Zero-build static

   One index.html plus Instrument Sans and six WebP plates - deploy anywhere static.

You get

• index.html (complete Lumen Roof hero)
• assets/images (sky / ground / house morning + night WebP)
• assets/fonts (Instrument Sans)
• WebGL fog canvas and day/night blend logic