Lumora

Overview

Lumora is a full-viewport focus/clarity marketing hero by SonoJS. Built with Vite, React 19, TypeScript, Tailwind CSS 4, and Lucide. Four switchable looping scenes (Golden Hour, Still Water, Deep Woods, Quiet Dawn) under a bobbing overlay.png, liquid-glass nav (How It Works / Features / Pricing / Community + Get Started), Over 10,000 minds badge, Clarity in an Endlessly Noisy Universe headline (Instrument Serif), email Get Early Access, scene switcher, and stats strip. Demo wellness chrome only - no waitlist backend. Vite build ready for Cloudflare Workers.

Highlights

1. 01

   Four scene stage

   Crossfade between Golden Hour, Still Water, Deep Woods, and Quiet Dawn.

2. 02

   Overlay + liquid glass

   Bobbing overlay.png with frosted nav, badge, and email Get Early Access pill.

3. 03

   Clarity headline

   Instrument Serif Clarity in an Endlessly Noisy Universe with adaptive light/dark type.

4. 04

   Vite and fork-ready

   Vite 8 + React 19 + TypeScript + Tailwind 4 + Lucide - npm run build to dist/.

You get

• Full Vite + React 19 + TypeScript source (Lumora)
• App.tsx with multi-video switcher, overlay, nav, and CTAs
• Tailwind CSS 4 via @tailwindcss/vite
• public/assets/videos (4 MP4 scenes)
• public/assets/overlay.png
• lucide-react