Patterns — the web's most-copied components, measured
The web's most-copied component patterns — pricing tables, logo marquees, command palettes and more — each measured from ~10 real shipped products and buildable by AI agents over MCP.
This is a static, crawlable rendering for search & AI engines. The interactive version — filters, live decode console, copy & export — is at https://mozaika.design/patterns.
Live patterns
- Pricing Table — 62 products measured. Multi-tier plan cards and comparison matrices with yearly toggles — measured from the products that price best.
- Logo Marquee — 225 products measured. Social-proof logo strips and marquees — the single most-copied pattern on the web.
- Testimonials & Case Studies — 231 products measured. Quote walls, case-study splits and social-proof heroes with real measured type and rhythm.
- Feature Grid & Bento — 330 products measured. Feature cards, icon grids and bento layouts — how shipped products actually compose them.
- Command Palette — 10 products measured. The hardest composed pattern, decoded live: anatomy tree, open motion, every state, on video.
- Global Navbar — 9 products measured. Sticky behavior measured on scroll — height, blur, border and shadow deltas as real tokens.
Measuring now
- Login / Auth Page — Auth layouts with focus and error states driven live — the first page every product needs.
- Data Table — Headers, rows, hover/selected/sorted states — the heart of app UI, measured from the canonical implementations.
- Onboarding Tour — Step popovers, spotlights and progress — decoded from the canonical open-source tour implementations.
- App Sidebar — Application shell navigation — item anatomy, active states and collapse motion from real app codebases.