Flowstate

Overview

Flowstate is a deep-work SaaS waitlist hero by SonoJS (demo brand: Flowstate). Zero-build static HTML with Onest fonts, custom CSS, Lenis smooth scroll, and a full-bleed WebGL fluid/ink canvas behind the copy. Hero Deep Work in a Distracted World with 10K+ already in flow badge, email Join Waitlist form, pill nav (How it works / Pricing / Products / Blog), and Get Started. Word-stagger reveals on load. Demo waitlist chrome only - form submit prevented, no backend. Run with npx --yes serve . or host statically on Cloudflare Workers.

Highlights

1. 01

   WebGL fluid stage

   Interactive ink/fluid canvas behind the hero - pointer-driven swirls.

2. 02

   Deep Work hero

   10K+ badge, word-stagger title, and Join Waitlist email bar.

3. 03

   Lenis smooth scroll

   Vendored Lenis with pill nav and Get Started chrome.

4. 04

   Zero-build static

   npx --yes serve . - index.html, css/, js/main.js, Onest fonts.

You get

• index.html (Flowstate — Deep Work waitlist)
• css/styles.css + fonts/onest.css + local woff2
• js/main.js (Lenis + WebGL fluid simulation)
• vendor/lenis.mjs

Run locally

From the unzipped project folder:

npx --yes serve .