Prince Caleb.dev
Let’s Build
Custom solution/ 2026

Lumen

Apple-inspired dark-theme product landing page with parallax animations, multi-ring orb hero, bento grid features, and snap-scroll carousel — built with React, Vite, TypeScript and Framer Motion

Lumen
//01Engineering record

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.

Want something like this
built for you?