xreactive.xyz
The site you are on: a monochrome portfolio and studio, rebuilt from scratch for its fourth version.
xreactive.xyz is my home on the web. Version four throws out the old card grid and starts again from type, black and white, and motion. Every section is rendered on the server from MongoDB, so what I change in the studio is on the site the moment I save it.
The look borrows the notched, masked panels of motorsport sites and makes them monochrome. The panels are cut with clip-path paths recomputed for every size, the hero is a topographic field drawn in a WebGL shader that bends around your cursor, and the about section turns a 3D x into text characters with three.js.
Behind it sits a private studio: projects and a timeline with drag-and-drop ordering, an inbox for the contact form, visit analytics, availability, and session management that warns me when a new device signs in.
What it does
- Server-rendered pages that update the moment the studio saves
- Notched panels cut with clip-path paths recomputed at every size
- A topographic WebGL field that bends around the cursor
- A 3D x rendered as text characters with three.js
- A private studio with inbox, analytics and new sign-in alerts
- Page curtain transitions, magnetic buttons and smooth scrolling
Built with
- Next.js
- React
- TypeScript
- Tailwind CSS
- three.js
- Framer Motion
- MongoDB
- Lenis