Overview
Purissimo is a design system that proves modern web doesn't need complexity. Built entirely with HTML5 and CSS—no JavaScript, no build tools, no dependencies—it delivers accessible, performant components inspired by the purity of Antarctic ice.
The Challenge
The web is drowning in complexity. Megabytes of JavaScript for a button. Build tools for build tools. Dependencies upon dependencies. I wanted to explore: what can we achieve with just the web platform itself?
My Role
End-to-end design and development: design system architecture, visual design, CSS implementation, documentation, and project site.
Process & Approach
- Constraint-driven design: The absence of JavaScript forced creative solutions using modern CSS (:has(), :target, CSS custom properties)
- Accessibility-first: WCAG 2.1 AA compliance as baseline, not afterthought
- AI collaboration: Built iteratively with Claude as design partner—demonstrating a new model of human-AI creative collaboration
Key Design Decisions
- Base-4 spacing system: Industry standard, works with common font sizes, easy to reason about
- Antarctic color palette: Reinforces the "purity" concept—whites, pale blues, glacial tones
- Outfit typography: Geometric, modern, excellent readability, freely available
- Native HTML patterns: <details> for accordions, :target for modals, radio inputs for tabs
Components Delivered
Buttons, Forms (inputs, selects, checkboxes, toggles), Cards, Alerts, Tables, Accordion, Tabs, Modal, Badges, Tooltips, Navigation—all with hover, focus, active, and disabled states.
Results
Project Gallery
