Design System

Portfolio components

Foundations

Introduction
Colors
Typography
Accessibility
Scrollbars

Components

Custom

M3 Shapes
Footer Monogram
Scrollbars
Mode Toggle
Theme Customizer
Site Header
Hero Section
Work Section
Skills Section
Contact Section
Ai Elements

Back to portfolio

Foundations

Design System

Component library and tokens for this portfolio — built with shadcn/ui, Tailwind CSS v4, and OKLCH colors.

Foundations

OKLCH semantic tokens for light and dark themes.

Geist type scale using Tailwind font tokens.

Material Design 3 expressive shapes for icons, masks, and placeholders.

Brand primary thumb with transparent track — global and component usage.

Featured components