404

Overview

404 is a full-viewport cinematic error-page hero by SonoJS (demo brand LGPSM). Built with Vite, React 19, TypeScript, and Tailwind CSS 4. Full-bleed looping hero-bg.mp4, white LGPSM wordmark, oversized gradient 404 numeral in Geist Mono, and The path may be broken, but the journey isn't. Let's get you back. copy. Demo 404 chrome only - no routing backend. Vite build ready for Cloudflare Workers.

Highlights

1. 01

   Cinematic video stage

   Full-bleed looping /hero-bg.mp4 behind a centered error composition.

2. 02

   Oversized 404 type

   Gradient Geist Mono numeral with a hairline rule and recovery copy.

3. 03

   LGPSM mark

   White logo lockup centered above the 404 stack.

4. 04

   Vite and fork-ready

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

You get

• Full Vite + React 19 + TypeScript source (404 / LGPSM)
• App.tsx cinematic 404 stage
• Tailwind CSS 4 via @tailwindcss/vite
• public/hero-bg.mp4
• public/fonts/GeistMono-SemiBold.woff2