Lumen

Lumen is an Apple-inspired product landing page built to demonstrate high-end frontend engineering, smooth animations, precise typography, and a dark premium aesthetic that matches the quality of the product it represents.

The hero section features a multi-ring animated orb with pointer parallax, the orb subtly follows the cursor, creating a tactile, premium feel that immediately signals quality. Framer Motion powers all entrance animations, hover states, and scroll-triggered reveals throughout the page.

The design system uses a pure black (#000000) background with #1d1d1f card surfaces, directly inspired by Apple's design language, combined with Inter and San Francisco-style typography for maximum readability and elegance.

Key sections include a product lineup with pricing cards, a bento grid for features and technology, and a snap-scroll carousel with custom SVG artwork per chapter telling the product story. The entire page is built with Vite + React + TypeScript + Tailwind CSS, zero runtime dependencies beyond the animation library.

Built as a portfolio showcase demonstrating the ability to deliver agency-quality frontend work with modern tooling and attention to detail.