Design System & Studio2026 · Design, Frontend & Content
Hashton.dev — Portfolio & Consulting
High-Performance Contract Engineering Surface

Contract and consulting portfolio with paper-and-ink design system, Mux intro video, MDX case studies, dark mode, and Tailwind v4 token architecture.
100/100Lighthouse score
Tailwind v4Tokens
FluidRestrained motion
The Challenge & Constraints
Creating an authoritative digital portfolio that instantly proves 11+ years of senior frontend taste, technical precision, and architectural maturity without generic templates or bloated animations.
Engineering Solution
Crafted a bespoke paper-and-ink visual identity using CSS custom properties bridged into Tailwind v4 `@theme`. Engineered an interactive Mux hero video player, dynamic MDX case study figures, and accessible focus management throughout.


Key Innovations & Highlights
- Tailwind v4 token architecture with custom paper-and-ink palette
- Dynamic MDX case study rendering with rich interactive preview figures
- Accessible modal dialogs with focus trap and keyboard controls
Delivered Outcomes
- ✓Sub-second load times with top-tier Core Web Vitals and 100/100 Lighthouse scores.
- ✓Seamless light/dark mode transition with zero layout shift or hydration flicker.
- ✓Direct conversion funnel generating inbound senior contract and consulting inquiries.
Technology Stack
Next.js 15React 19TypeScriptTailwind CSS v4MDX
View Live Project
Explore the production implementation at hashton.dev