Bloom

Overview

Bloom is a full-viewport AI plant-design marketing hero by SonoJS. Built with Vite, React 19, TypeScript, Tailwind CSS 3, and Lucide. Full-bleed looping hero-bg.mp4, liquid-glass left panel with bloom mark, Innovating the spirit of bloom AI headline, Explore Now CTA, Artistic Gallery / AI Generation / 3D Structures pills, VISIONARY DESIGN quote, and a right-rail ecosystem with socials, Processing / Growth Archive cards, and floral sculpting preview. Demo botanical-AI chrome only - no generation backend. Vite build ready for Cloudflare Workers.

Highlights

1. 01

   Garden video stage

   Full-bleed /hero-bg.mp4 behind a liquid-glass bloom left panel.

2. 02

   Spirit of bloom AI

   Italic display headline, Explore Now, and gallery / generation / 3D pills.

3. 03

   Ecosystem rail

   Socials, Processing / Growth Archive cards, and floral sculpting preview.

4. 04

   Vite and fork-ready

   Vite 6 + React 19 + TypeScript + Tailwind 3 + Lucide - npm run build to dist/.

You get

• Full Vite + React 19 + TypeScript source (Bloom)
• Index.tsx split-panel hero with liquid-glass chrome
• Tailwind CSS 3 + PostCSS
• public/hero-bg.mp4 and logo.png
• src/assets/hero-flowers.png
• lucide-react