Button
Toda variante, tom e animação
Componentes animados
132 componentes grátis que dão vida às telas do app: números rolando, toasts empilhados, abas deslizantes, inputs que tremem. CSS em primeiro lugar, movimento reduzido respeitado, claro e escuro. Filtre pelo que os move.
Ctrl K
132 componentes
UI base 30
ExplorarPlaygroundGrátis
Badge
Status em todos os estilos
Card
Cards em camadas com destaques
Input
Rótulos, ícones e estados
Avatar
Status, anéis e grupos
Alert
Mensagens inline com ações
Tabs
Seis estilos de abas, uma API
Switch
Interruptor em cinco looks
Checkbox & Radio
Checks, radios e cards
Separator
Divisores com rótulo
Breadcrumb
Caminhos que recolhem direitinho
Pagination
Páginas, tamanhos e saltos
Heading
Títulos com movimento
Text
Texto corrido com presets
Link
Sete estilos de sublinhado
Kbd
Teclas que reagem ao toque
Stat Card
Uma métrica com tendência
Select
Com busca, grupos e múltiplo
Dialog & Sheet
Diálogos e sheets
Tooltip
Dicas ricas com atalhos
Popover
Painéis flutuantes
Dropdown Menu
Menus com submenus
Combobox
Busca com resultados assíncronos
Date Picker
Datas, períodos e hora
Multi-step Form
Assistentes com validação
Number Input
Contadores com formatação
Rating
Estrelas com meio ponto
Toggle Group
Escolha um ou vários
Table
Ordene, empilhe e colora linhas
Data Grid
Edite, fixe e exporte
Números e dados 8
ExplorarNumber flow
Os dígitos rolam até o novo valor
Counter up
Conta ao entrar na tela
Usage meter
Uso que avisa ao encher
Progress
Barras em todos os estilos
Circular progress
Anéis e medidores
Sparkline draw
Um mini gráfico que se desenha
Delta badge
Subiu ou caiu num relance
Cell flash
Células piscam quando o valor muda
Feedback 7
ExplorarToast stack
Avisos que empilham e abrem em leque
Notification badge
Contadores com pop e pulso
Skeleton auto
Skeletons do seu layout real
Spinners
Seis loaders, uma prop
Multi-step loader
Tarefas longas, passo a passo
Confetti
Uma explosão de festa
Success check
Um check que se desenha com brilho
Navegação 6
ExplorarTabs indicator
Um indicador desliza entre abas
Segmented control
Seletor deslizante estilo iOS
Stepper
Etapas que enchem e são marcadas
Dock
Dock do macOS que amplia
Bottom navigation
Barra mobile com pílula deslizante
Command palette morph
Uma busca vira paleta
Overlays 5
ExplorarMorphing dialog
Um card se expande em diálogo
Spring drawer
Painel elástico, arraste para fechar
Popover morph
Um botão cresce até virar painel
Animated tooltip
Tooltips que pulam no lugar
Stagger dropdown
Itens de menu em cascata
Listas e tabelas 6
ExplorarAccordion height
Altura suave, sem saltos
List reorder
Arraste para reordenar com mola
Table row presence
Linhas que entram e saem
Animated list
Novos itens entram pelo topo
Tree expand
Pastas que se abrem
Expandable row list
Linhas que abrem no lugar
Inputs 10
ExplorarTag input
Chips com sugestões
OTP input
Código único com avanço automático
Floating label input
O rótulo flutua ao focar
Vanish input
Placeholders que alternam e somem
Input shake
Treme no erro, marca no sucesso
Spring switch
Interruptor com botão elástico
Drawn checkbox
O check se desenha sozinho
Slider with tooltip
Faixa com valores ao vivo
Expanding search
Busca que abre quando precisa
File drop zone
Área de soltar com progresso
Botões 10
ExplorarShimmer button
Um brilho passa pelo botão
Ripple button
A tinta se espalha do clique
Rainbow button
Uma borda arco-íris fluida
Border beam button
Um feixe orbita a borda
Magnetic button
Atraído pelo cursor
Stateful button
Carregando, sucesso e erro prontos
Copy button
Copia com check que se transforma
Hold to confirm
Segure para confirmar ações de risco
Liquid glass button
Vidro fosco com lente deslizante
Theme toggle
De claro a escuro com varredura circular
Texto 9
ExplorarText reveal
As palavras ganham foco
Typewriter
Digita e apaga frases
Word rotate
Uma palavra que não para de mudar
Shiny text
Um brilho que passa pelo texto
Gradient text
Títulos com gradiente animado
Scramble text
As letras se decifram
Highlighter
Um traço de marca-texto à mão
Text morph
Letras viram outra palavra
Scroll velocity
Texto que acelera ao rolar
Cards e efeitos 6
ExplorarSpotlight card
Uma luz segue o ponteiro
Tilt card
Inclinação 3D com camadas
Border beam
A luz percorre o card
Glow border
Um brilho suave animado
Progressive blur
O conteúdo se dissolve em desfoque
Expandable card
Um card que abre no lugar
Fundos 5
ExplorarDot grid
Pontos que acendem perto do ponteiro
Flickering grid
Uma grade com cintilar discreto
Aurora
Aurora boreal lenta
Particles
Partículas flutuantes ligadas
Marquee
Uma faixa que corre sem parar
IA e agentes 16
ExplorarChat message
Mensagens com markdown e ações
Streaming text
Texto que chega aos poucos
Tool call
Execuções de ferramentas com status
Reasoning block
Raciocínio expansível
Model picker
Escolha o modelo por velocidade e preço
Chat composer
Caixa de prompt com arquivos e comandos
Citations
Fontes inline
Agent plan
Um checklist de agente ao vivo
Token meter
Veja o contexto encher
Voice orb
Uma esfera que reage à voz
Diff view
Revise mudanças bloco a bloco
Code block
Código destacado com copiar
Suggestion chips
Ideias para iniciar o prompt
Thread list
Histórico de chats com busca
Eval score
Notas contra um limite
Typing indicator
Alguém está digitando
Gráficos 14
ExplorarArea chart
Tendências preenchidas com scrub
Line chart
Linhas que se desenham
Bar chart
Barras agrupadas ou empilhadas
Donut chart
Fatia de um todo
Radial progress
Anéis de meta concêntricos
Heatmap
Atividade num relance
Funnel chart
Onde as pessoas desistem
Gauge
Um número no mostrador
Bump chart
Rankings ao longo do tempo
Treemap
Tamanhos em blocos
Timeline chart
Um Gantt para planos
Waterfall chart
Altas e baixas até o total
KPI trend
Um número com sua sparkline
Chart legend
Clique para ocultar uma série