ONDA 2 · DEV LUXURY
Resend.com
Minimalismo radical preto & branco, 71 SVGs limpos e Geist tipografia.
ESTÚDIO DE DISSECAÇÃO ANATÔMICA & ASTRO UI KIT
Cazula Design Lab
Alterne entre as vibes dos melhores Design Systems do mundo e teste os novos componentes canônicos em Astro em tempo real.
PERSONALIDADE ATIVA (CLIQUE PARA MUDAR):
Testados nas 6 variantes canônicas com física de pressão tátil Emil Kowalski e chanfro de luz:
import: TactileButton from '@/components/ui/TactileButton.astro'physics: scale(0.97) translateY(1px) on active · 140ms springtop-reflection: inset 0 1px 0 rgba(255,255,255,0.4)Menus flutuantes com física de mola, atalhos de teclado (⌘K, ⇧E) e navegação via setas (↑ / ↓):
import: DropdownMenu from '@/components/ui/DropdownMenu.astro'keyboard-nav: ArrowDown, ArrowUp, Escape, Enter e atalhosglass-blur: backdrop-filter: blur(24px) · inset chamfer 1pxPasse o cursor sobre este card! Um feixe de luz radial na cor da vibe ativa segue a posição do mouse em tempo real:
SPOTLIGHT LIGHT PHYSICS
Iluminação Dinâmica por Cursor
Inspirado nos cards de produtos da Apple, Vercel e Stripe. Simula a luz de uma lanterna física sobre o vidro escuro.
import: ChamferCard from '@/components/ui/ChamferCard.astro'radial-beam: 450px circle at var(--mouse-x) var(--mouse-y)Badges em tipografia JetBrains Mono de alta precisão com pulsos de status em tempo real:
LIVE NODE: GRU01 99.98% UPTIME TTFB 8.4MS WAF BLOCKED 0 VIBE ENGINE ATIVA
Biblioteca de 15 Design Systems Extraídos
Ondas 1 e 2 dissecadas na íntegra. Acesse o living design system e tokens JSON de cada ecossistema:
ONDA 2 · MOTION MASTER
Framer.com
52 cores, 326 SVGs classificados, fontes GT Walsheim e físicas elásticas.
ONDA 2 · VANGUARDA UI
21st.dev
184 cores hex, componentes Shadcn de última geração e border-beams.
ONDA 2 · CALENDAR & POP
Notion Calendar
108 cores, iA Writer Mono, menus flutuantes densos e micro-atalhos.
ONDA 2 · BIG TECH GOV
GitHub Primer
485 cores hex, tipografia Mona Sans / Hubot Sans, máxima acessibilidade.
ONDA 1 · BENCHMARK
Linear.app
45 cores hex, sub-pixel borders, chanfro superior e 218 SVGs.
ONDA 1 · BENCHMARK
Stripe.com
190 cores hex, tipografia Söhne / SourceCodePro, 154 SVGs.
ONDA 1 · BENCHMARK
Raycast.com
138 cores hex, tipografia Geist Mono / SF Pro, 134 SVGs.
ONDA 1 · BENCHMARK
Supabase.com
527 cores hex, Manrope / Inter, telemetria viva e 130 SVGs.
ONDA 1 · DESTAQUE
Driftime Studio
180 cores hex, Geist / Landour, tipografia editorial de luxo.
ONDA 1 · DESTAQUE
Raneo Automation
Feito em Astro! 13 cores hex, Google Sans e 130 SVGs.