# Todos os 268 componentes

Os 268 componentes do THM Componentes, organizados nas 14 categorias por propósito. Filtre pelo que você procura, com o nome técnico ou com as suas palavras.

## Fundos e atmosferas

- [Aurora](https://vibecode.thmtecnologia.com/componentes/aurora/): Céu noturno com cortinas de luz verde e ciano que ondulam sobre estrelas e uma cadeia de montanhas.
- [Boids](https://vibecode.thmtecnologia.com/componentes/boids/): Centenas de setas finas voam juntas como um bando de pássaros e se espalham quando o cursor chega perto.
- [Caustics](https://vibecode.thmtecnologia.com/componentes/caustics/): Reflexos de luz dançando como no fundo de uma piscina ao sol, com bordas levemente coloridas.
- [Flow Field](https://vibecode.thmtecnologia.com/componentes/flow-field/): Milhares de linhas finas correm em correntes curvas, como fios de seda ao vento, sobre um fundo claro.
- [Fluid](https://vibecode.thmtecnologia.com/componentes/fluid/): Tinta colorida que escorre e gira na tela atrás do conteúdo, empurrada pelo movimento do mouse.
- [Glass Orb](https://vibecode.thmtecnologia.com/componentes/glass-orb/): Uma bola de vidro com um redemoinho de tinta índigo e ciano dentro, que gira devagar sobre um chão claro.
- [GPU Particles](https://vibecode.thmtecnologia.com/componentes/gpu-particles/): Centenas de milhares de grãos finos correm em filamentos, como tinta no papel, e giram em volta do cursor.
- [Liquid Metal](https://vibecode.thmtecnologia.com/componentes/liquid-metal/): Uma gota de metal espelhado que pulsa devagar, muda de forma e se estica em direção ao cursor.
- [Mesh Gradient](https://vibecode.thmtecnologia.com/componentes/mesh-gradient/): Manchas de índigo, ciano e lavanda que se misturam e derivam devagar, com um grão leve de filme.
- [Metaballs](https://vibecode.thmtecnologia.com/componentes/metaballs/): Gotas brilhantes de cor índigo que se juntam e se separam como líquido, e uma delas segue o cursor.
- [Reaction Diffusion](https://vibecode.thmtecnologia.com/componentes/reaction-diffusion/): Manchas e ramos índigo crescem sozinhos como coral ou pele de animal, e o cursor planta novos focos.
- [Aurora Background](https://vibecode.thmtecnologia.com/componentes/aurora-background/): Fundo animado em CSS com faixas de luz azul e violeta que deslizam devagar, como uma aurora boreal.
- [Black Hole Background](https://vibecode.thmtecnologia.com/componentes/black-hole-background/): Anéis e linhas finas formam um túnel que afunila para um ponto, com uma coluna de luz colorida no centro.
- [Bubbles Background](https://vibecode.thmtecnologia.com/componentes/bubbles-bg/): Centenas de bolhas em 3D sobem e descem devagar sobre um céu que muda de azul para laranja.
- [Cosmic Portal](https://vibecode.thmtecnologia.com/componentes/cosmic-portal/): Um portal de ficção científica com núcleo de luz, anéis, cristais flutuantes e poeira estelar, girando no espaço.
- [Falling Stars Background](https://vibecode.thmtecnologia.com/componentes/falling-stars/): Estrelas que saem do centro da tela e correm para as bordas com rastro de luz, como uma nave acelerando.
- [Flickering Grid](https://vibecode.thmtecnologia.com/componentes/flickering-grid/): Grade de quadradinhos que acendem e apagam ao acaso, em ritmo lento, como um painel de LED em repouso.
- [Interactive Grid Pattern](https://vibecode.thmtecnologia.com/componentes/interactive-grid-pattern/): Grade de linhas finas em que cada quadrado acende quando o mouse passa e se apaga devagar, deixando um rastro.
- [Lamp Effect](https://vibecode.thmtecnologia.com/componentes/lamp-effect/): Uma linha de luz ciano se acende no alto de uma seção escura e espalha brilho sobre o título logo abaixo.
- [Liquid Background](https://vibecode.thmtecnologia.com/componentes/liquid-background/): Superfície líquida em rosa, lilás e verde-água que escorre e se dobra sem parar, como um holograma.
- [Neural Background](https://vibecode.thmtecnologia.com/componentes/neural-background/): Fios finos de luz azul se ramificam a partir de nós brilhantes sobre fundo preto, como neurônios acesos no escuro.
- [Particle Whirlpool](https://vibecode.thmtecnologia.com/componentes/particle-whirlpool-bg/): Milhares de partículas coloridas e brilhantes giram em enxame em volta de um ponto que segue o mouse.
- [Particles Background](https://vibecode.thmtecnologia.com/componentes/particles-bg/): Pontinhos que flutuam devagar pelo fundo e deslizam de leve na direção do mouse, como poeira no ar.
- [Pattern Background](https://vibecode.thmtecnologia.com/componentes/pattern-background/): Fundo de grade fina ou de pontos que some nas bordas e pode deslizar devagar numa direção.
- [Ribbon Background](https://vibecode.thmtecnologia.com/componentes/ribbon-background/): Cinco fitas coloridas em camadas, com sombras suaves, ondulando devagar de um lado a outro da tela.
- [Ripple](https://vibecode.thmtecnologia.com/componentes/ripple/): Anéis concêntricos que pulsam de dentro para fora atrás de um logo, ícone ou botão, como ondas num lago.
- [Scales](https://vibecode.thmtecnologia.com/componentes/scales/): Listras finas e discretas, na diagonal, na horizontal ou na vertical, que dão textura ao fundo de uma área.
- [Silk Background](https://vibecode.thmtecnologia.com/componentes/silk-background/): Tecido de cetim escuro com dobras diagonais que ondulam devagar, com brilho frio e textura de trama fina.
- [Singularity Background](https://vibecode.thmtecnologia.com/componentes/singularity-background/): Um anel de luz laranja e azul gira em volta de um centro escuro, como um buraco negro engolindo poeira cósmica.
- [Snowfall Background](https://vibecode.thmtecnologia.com/componentes/snowfall-bg/): Flocos de neve caindo devagar pelo fundo da página, com leve desvio para os lados, para campanhas de inverno.
- [Sparkles](https://vibecode.thmtecnologia.com/componentes/sparkles/): Pontinhos de luz que piscam e sobem devagar, como purpurina no ar, atrás de um título ou de toda a seção.
- [Stars Background](https://vibecode.thmtecnologia.com/componentes/stars-background/): Céu noturno com estrelas de três tamanhos subindo devagar e se deslocando de leve quando o mouse passa.
- [Stractium Background](https://vibecode.thmtecnologia.com/componentes/stractium-background/): Uma escultura abstrata de camadas finas flutua e se retorce num céu claro, iluminada por um sol.
- [Tetris](https://vibecode.thmtecnologia.com/componentes/tetris/): Quadrados que caem devagar numa grade e se empilham no fundo, como no Tetris, e somem quando você clica.
- [Thunderstorm Background](https://vibecode.thmtecnologia.com/componentes/thunderstorm-background/): Nuvens escuras de tempestade iluminadas por dentro por raios azuis, dourados e brancos que vêm e vão.
- [Vortex Background](https://vibecode.thmtecnologia.com/componentes/vortex/): Centenas de pontinhos neon em azul, violeta e magenta fluindo em correntes curvas sobre um fundo escuro.
- [Warp Background](https://vibecode.thmtecnologia.com/componentes/warp-background/): Um card no centro de um túnel de grade em 3D, com faixas de luz coloridas correndo pelas paredes até as bordas.
- [Wavy Background](https://vibecode.thmtecnologia.com/componentes/wavy-background/): Cinco ondas de luz neon, grossas e desfocadas, ondulando sem parar no meio de um fundo escuro.

## Texto e tipografia

- [Assinatura](https://vibecode.thmtecnologia.com/componentes/signature/): Uma assinatura caligráfica que aparece traço a traço, como se uma caneta invisível escrevesse na tela.
- [Decode Text](https://vibecode.thmtecnologia.com/componentes/decode-text/): Título que surge embaralhado em letras, números e símbolos e vai se acertando até formar a frase.
- [Gooey Text](https://vibecode.thmtecnologia.com/componentes/gooey-text/): Palavras que se revezam no título, derretendo uma na outra como gotas que se juntam antes de ficarem nítidas.
- [Kinetic Text](https://vibecode.thmtecnologia.com/componentes/kinetic-text/): Uma frase repetida corre sem parar sobre um nó tridimensional que gira devagar e inclina com o mouse.
- [Particle Text](https://vibecode.thmtecnologia.com/componentes/particle-text/): Uma palavra desenhada com milhares de pontinhos coloridos que se espalham quando o mouse passa e voltam ao lugar.
- [Text Shatter](https://vibecode.thmtecnologia.com/componentes/text-shatter/): Um título que se parte em centenas de cacos ao clicar ou passar o mouse e se monta de novo sozinho.
- [Variable Wave](https://vibecode.thmtecnologia.com/componentes/variable-wave/): Um título em que cada letra fica mais fina ou mais grossa numa onda contínua e engrossa perto do mouse.
- [3D Text](https://vibecode.thmtecnologia.com/componentes/3d-text/): Letras brancas com contorno preto grosso e sombra amarela deslocada, balançando de leve como letreiro de desenho.
- [Blur Reveal](https://vibecode.thmtecnologia.com/componentes/blur-reveal/): Títulos e parágrafos que aparecem um depois do outro, saindo de um borrão e subindo de leve até ficarem nítidos.
- [Box Reveal](https://vibecode.thmtecnologia.com/componentes/box-reveal/): Um bloco de cor cobre o título e recolhe para o lado, deixando o texto aparecer subindo de leve.
- [Breathing Text](https://vibecode.thmtecnologia.com/componentes/breathing-text/): Texto em fonte variável em que as letras engrossam e afinam uma após a outra, como se a palavra respirasse.
- [Colourful Text](https://vibecode.thmtecnologia.com/componentes/colorful-text/): Uma palavra do título em que cada letra ganha uma cor viva e as cores se embaralham a cada cinco segundos.
- [Container Text Flip](https://vibecode.thmtecnologia.com/componentes/container-text-flip/): Uma palavra dentro de uma caixa em relevo que troca sozinha, e a caixa estica ou encolhe para caber a nova.
- [Encrypted Text](https://vibecode.thmtecnologia.com/componentes/encrypted-text/): Frase que surge como símbolos sorteados e se revela letra por letra, da esquerda para a direita.
- [Flip Words](https://vibecode.thmtecnologia.com/componentes/flip-words/): Uma palavra no meio do título troca sozinha a cada poucos segundos, com a nova entrando letra por letra.
- [Focus](https://vibecode.thmtecnologia.com/componentes/focus/): Frase com as palavras borradas, em que uma moldura de câmera deixa nítida uma palavra de cada vez.
- [Highlight Text](https://vibecode.thmtecnologia.com/componentes/highlight-text/): Uma faixa de cor cresce atrás de um trecho do texto, como um marca-texto passando sobre a frase.
- [Hyper Text](https://vibecode.thmtecnologia.com/componentes/hyper-text/): Palavra em maiúsculas que embaralha as letras ao passar o mouse e se forma de novo em menos de um segundo.
- [Letter Pullup](https://vibecode.thmtecnologia.com/componentes/letter-pullup/): Título que entra na página com cada letra subindo de baixo, uma depois da outra, como uma onda.
- [Letter Swap](https://vibecode.thmtecnologia.com/componentes/letter-swap/): Ao passar o mouse, cada letra desliza na vertical e dá lugar a uma cópia, numa onda que atravessa a palavra.
- [Line Shadow Text](https://vibecode.thmtecnologia.com/componentes/line-shadow-text/): Palavra com uma sombra feita de listras diagonais finas, que deslizam devagar atrás das letras.
- [Media Text](https://vibecode.thmtecnologia.com/componentes/media-text/): Uma frase em duas partes que se afastam para abrir espaço a uma foto ou a um vídeo pequeno no meio.
- [Morphing Text](https://vibecode.thmtecnologia.com/componentes/morphing-text/): Uma palavra derrete e se transforma na próxima, com as letras se fundindo como gotas de tinta.
- [Number Ticker](https://vibecode.thmtecnologia.com/componentes/number-ticker/): Número que parte do zero e corre até o valor final quando aparece na tela, como um placar.
- [Radiant Text](https://vibecode.thmtecnologia.com/componentes/radiant-text/): Texto em cinza suave com uma faixa de brilho que atravessa as letras de tempos em tempos.
- [Screw Text](https://vibecode.thmtecnologia.com/componentes/screw-text/): Ao passar o mouse, cada letra gira como um pequeno cubo, uma depois da outra, numa onda em 3D.
- [Scroll Swap Text](https://vibecode.thmtecnologia.com/componentes/scroll-swap-text/): Cada linha de texto rola na vertical e dá lugar a uma cópia idêntica, no ritmo da rolagem.
- [Sparkles Text](https://vibecode.thmtecnologia.com/componentes/sparkles-text/): Estrelinhas violeta e rosa piscam e giram por cima da palavra, aparecendo e sumindo sem parar.
- [Spinning Text](https://vibecode.thmtecnologia.com/componentes/spinning-text/): Uma frase curta dá a volta num círculo e gira sem parar, como um selo carimbado ao lado do botão.
- [Text Generate Effect](https://vibecode.thmtecnologia.com/componentes/text-generate-effect/): As palavras saem do desfoque e aparecem uma depois da outra, como se o texto estivesse sendo gerado na hora.
- [Text Glitch](https://vibecode.thmtecnologia.com/componentes/text-glitch/): Faixas do título aparecem deslocadas para os lados com rastros vermelho e ciano, como uma tela com defeito.
- [Text Highlight](https://vibecode.thmtecnologia.com/componentes/text-highlight/): Uma faixa de cor preenche o fundo da palavra da esquerda para a direita, como uma caneta marca-texto.
- [Text Hover Effect](https://vibecode.thmtecnologia.com/componentes/text-hover-effect/): Uma palavra gigante só em contorno aparece quando o mouse passa e ganha, perto do cursor, as cores que você definir.
- [Text Reveal](https://vibecode.thmtecnologia.com/componentes/text-reveal/): Cada linha do parágrafo sobe de trás de uma borda invisível e aparece em sequência, com parada suave.
- [Text Reveal Card](https://vibecode.thmtecnologia.com/componentes/text-reveal-card/): Duas frases no mesmo lugar: uma linha vertical segue o mouse e mostra a outra frase de um lado dela.
- [Text Scroll Reveal](https://vibecode.thmtecnologia.com/componentes/text-scroll-reveal/): A frase fica fixa na tela e cada palavra passa do cinza apagado à cor cheia conforme você rola.
- [Typewriter Text](https://vibecode.thmtecnologia.com/componentes/typewriter-text/): As letras aparecem uma a uma com um cursor piscando, somem e dão lugar à próxima palavra da lista.
- [Underline Text](https://vibecode.thmtecnologia.com/componentes/underline-text/): Uma linha fina surge embaixo da palavra quando o mouse passa, crescendo do centro ou atravessando de um lado ao outro.
- [Variable Letter Text](https://vibecode.thmtecnologia.com/componentes/variable-letter-text/): Ao passar o mouse, as letras ficam mais grossas uma de cada vez, numa onda que percorre a palavra.
- [Variable Text](https://vibecode.thmtecnologia.com/componentes/variable-text/): As letras perto do mouse engrossam e as mais distantes continuam finas, numa mancha de negrito que segue o cursor.
- [Video Text](https://vibecode.thmtecnologia.com/componentes/video-text/): Um título em letras grandes com um vídeo tocando por dentro, como se as letras fossem janelas para a cena.

## Efeitos especiais

- [Border Beam](https://vibecode.thmtecnologia.com/componentes/thm-border-beam/): Cartão com um feixe de luz que dá voltas pela borda e um brilho suave que acompanha o mouse por dentro.
- [Animated Beam](https://vibecode.thmtecnologia.com/componentes/animated-beam/): Linhas finas ligam ícones e cards, e um pulso de luz colorida corre por elas, mostrando os dados em movimento.
- [Border Beam](https://vibecode.thmtecnologia.com/componentes/border-beam/): Um pequeno feixe de luz colorida dá voltas pela borda de um card ou seção, como um cometa contornando a moldura.
- [Confetti](https://vibecode.thmtecnologia.com/componentes/confetti/): Uma explosão de papeizinhos coloridos sobe e cai na tela quando a pessoa conclui uma compra, um cadastro ou uma meta.
- [Dither Shader](https://vibecode.thmtecnologia.com/componentes/dither-shader/): Transforma uma foto em padrão de pontinhos de poucas cores, com cara de jogo antigo ou de impressão retrô.
- [Float](https://vibecode.thmtecnologia.com/componentes/float/): Qualquer imagem ou ícone passa a boiar devagar, subindo, descendo e girando de leve, sem parar.
- [Glow Border](https://vibecode.thmtecnologia.com/componentes/glow-border/): Um brilho colorido passeia devagar pela borda de um card ou campo, acendendo um trecho e depois outro.
- [Glowing Effect](https://vibecode.thmtecnologia.com/componentes/glowing-effect/): Quando o mouse chega perto de um card, um arco de luz colorida acende na borda e gira para apontar o cursor.
- [HTML ASCII](https://vibecode.thmtecnologia.com/componentes/html-ascii/): O conteúdo real da página é redesenhado ao vivo como arte ASCII, com caracteres que imitam luz e sombra.
- [HTML Blaze](https://vibecode.thmtecnologia.com/componentes/html-blaze/): Chamas sobem da base da página, o calor faz o conteúdo ondular e faíscas laranja voam para cima.
- [HTML Chromatic](https://vibecode.thmtecnologia.com/componentes/html-chromatic/): Ao mover o mouse sobre a página, o vermelho e o azul se descolam do conteúdo, como uma imagem 3D vista sem os óculos.
- [HTML Cloth](https://vibecode.thmtecnologia.com/componentes/html-cloth/): O conteúdo da página se dobra e ondula devagar, como um pano leve balançando com a brisa.
- [HTML Drag](https://vibecode.thmtecnologia.com/componentes/html-drag/): Ao girar a roda do mouse sobre ele, o conteúdo se curva como uma folha de papel e depois volta ao lugar.
- [HTML in Canvas](https://vibecode.thmtecnologia.com/componentes/html-in-canvas/): Seu HTML de verdade passa por um efeito gráfico da placa de vídeo, como ondas de água, e segue clicável.
- [HTML Liquid](https://vibecode.thmtecnologia.com/componentes/html-liquid/): O conteúdo da página parece estar sob uma lâmina d'água e solta ondas por onde o mouse passa.
- [Images Badge](https://vibecode.thmtecnologia.com/componentes/images-badge/): Um selo com ícone de pasta amarela: ao passar o mouse, a pasta abre e até três fotos saltam em leque.
- [Liquid Glass Effect](https://vibecode.thmtecnologia.com/componentes/liquid-glass/): Um painel de vidro que entorta o conteúdo que passa por trás, com bordas que refratam e separam as cores.
- [Liquid Logo](https://vibecode.thmtecnologia.com/componentes/liquid-logo/): Seu logo vira uma peça de metal espelhado, com reflexos que escorrem devagar pela superfície.
- [Meteors](https://vibecode.thmtecnologia.com/componentes/meteors/): Pequenos riscos com cauda atravessam o card na diagonal, como estrelas cadentes, cada um no seu ritmo.
- [Neon Border](https://vibecode.thmtecnologia.com/componentes/neon-border/): Uma borda fina com luz azul e rosa que gira em volta do campo ou do botão, como um letreiro de neon.
- [Progressive Blur](https://vibecode.thmtecnologia.com/componentes/progressive-blur/): A imagem ou o conteúdo vai ficando embaçado aos poucos até a borda, como um vidro cada vez mais fosco.
- [Scratch To Reveal](https://vibecode.thmtecnologia.com/componentes/scratch-to-reveal/): Um cartão coberto por uma camada colorida que a pessoa raspa com o mouse ou o dedo para descobrir o prêmio.
- [Shader Toy Viewer](https://vibecode.thmtecnologia.com/componentes/shader-toy/): Uma tela que roda efeitos visuais escritos em GLSL, como campos de estrelas e vórtices, e reage ao mouse.
- [SVG Mask](https://vibecode.thmtecnologia.com/componentes/svg-mask/): Um círculo que segue o mouse e, sobre o título, cresce para revelar uma segunda mensagem escondida.

## Interação e física

- [Card Stack](https://vibecode.thmtecnologia.com/componentes/thm-card-stack/): Pilha de fotos em que você arrasta o cartão de cima para o lado e ele volta para o fundo com efeito de mola.
- [Elastic Slider](https://vibecode.thmtecnologia.com/componentes/elastic-slider/): Barra de ajuste em que o trilho estica como elástico quando você puxa além do fim e volta balançando.
- [Elastic Trail](https://vibecode.thmtecnologia.com/componentes/elastic-trail/): Uma fita colorida, grossa na cabeça e fina na ponta, que persegue o mouse como uma serpente.
- [Gravity Tags](https://vibecode.thmtecnologia.com/componentes/gravity-tags/): Pílulas com nomes de serviços despencam na tela, batem umas nas outras e empilham; dá para arrastar e jogar.
- [Holo Card](https://vibecode.thmtecnologia.com/componentes/holo-card/): Cartão com arte que inclina em 3D sob o mouse e brilha com reflexo arco-íris, como uma carta colecionável rara.
- [Morph Blob](https://vibecode.thmtecnologia.com/componentes/morph-blob/): Uma bolha em gradiente que muda de contorno devagar, como se respirasse, e se estica na direção do mouse.
- [Rope Mobile](https://vibecode.thmtecnologia.com/componentes/rope/): Fios finos presos num trilho no alto, com cartões ou formas na ponta, que balançam ao vento e podem ser puxados.
- [Parallax Float](https://vibecode.thmtecnologia.com/componentes/parallax-float/): Fotos e elementos espalhados que se deslocam em velocidades diferentes conforme o mouse, criando profundidade.

## 3D e espaço

- [ASCII Render](https://vibecode.thmtecnologia.com/componentes/ascii/): Uma forma 3D girando na tela, desenhada ao vivo com letras e símbolos de terminal em vez de pixels.
- [Carrossel 3D](https://vibecode.thmtecnologia.com/componentes/carousel-3d/): Fotos dispostas em roda, como num cilindro, que você gira arrastando, com inércia e reflexo no chão.
- [Cloth](https://vibecode.thmtecnologia.com/componentes/cloth/): Sua imagem vira uma bandeira de tecido que ondula ao vento e pode ser puxada com o mouse ou com o dedo.
- [Gallery Tunnel](https://vibecode.thmtecnologia.com/componentes/gallery-tunnel/): Um corredor sem fim com quadros nas duas paredes, que você percorre com a roda do mouse, arrastando ou pelas setas.
- [Globe Connections](https://vibecode.thmtecnologia.com/componentes/globe-connections/): Globo de pontinhos que gira sozinho, com arcos de luz ligando 12 cidades reais pelo mundo.
- [Instanced Cluster](https://vibecode.thmtecnologia.com/componentes/instanced-cluster/): Um monte de bolas e cubos foscos que se apertam no centro e abrem caminho quando o mouse passa.
- [Ocean](https://vibecode.thmtecnologia.com/componentes/ocean/): Mar calmo ao pôr do sol, com ondas em movimento, reflexo dourado do sol e uma boia balançando.
- [Particle Morph](https://vibecode.thmtecnologia.com/componentes/particle-morph/): Milhares de pontinhos que voam e se reorganizam em esfera, anel, cubo e no texto que você escolher.
- [Product Configurator](https://vibecode.thmtecnologia.com/componentes/product-configurator/): Uma garrafa em 3D que gira com o dedo ou o mouse, troca de cor e acabamento e atualiza o preço na hora.
- [Raymarch Blob](https://vibecode.thmtecnologia.com/componentes/raymarch-blob/): Uma forma líquida em 3D que ondula, se funde com um anel e duas cápsulas e gira conforme o mouse.
- [3D Carousel](https://vibecode.thmtecnologia.com/componentes/carousal-3d/): Painéis de imagem grandes dispostos em anel, girando sem parar à sua volta, que você pode arrastar.
- [Bending Gallery](https://vibecode.thmtecnologia.com/componentes/bending-gallery/): Fotos em fileira sobre uma curva, que deslizam com arrasto ou rolagem e ondulam de leve ao se mover.
- [Book](https://vibecode.thmtecnologia.com/componentes/book/): Capa de livro em 3D feita só com CSS, que gira de lado no hover e revela a borda branca das páginas.
- [Cube Carousel](https://vibecode.thmtecnologia.com/componentes/cube-carousel/): Um cubo que gira com o arraste e mostra uma foto ou um vídeo em cada face.
- [Github Globe](https://vibecode.thmtecnologia.com/componentes/github-globe/): Globo azul com países feitos de hexágonos e arcos coloridos que cruzam o planeta, no estilo do GitHub.
- [Globe](https://vibecode.thmtecnologia.com/componentes/globe/): Globo claro de pontinhos com marcadores laranja em grandes cidades, girando devagar e fácil de arrastar.
- [Icon Cloud](https://vibecode.thmtecnologia.com/componentes/icon-cloud/): Bola de ícones redondos girando em 3D, que segue o mouse e traz para a frente o ícone clicado.
- [Infinite Grid](https://vibecode.thmtecnologia.com/componentes/infinite-grid/): Uma parede de cartões com imagem que você arrasta para qualquer lado, sem nunca chegar ao fim.
- [Light Speed](https://vibecode.thmtecnologia.com/componentes/light-speed/): Uma estrada noturna com rastros de faróis passando em alta velocidade, que acelera quando você segura o clique.
- [Orbit](https://vibecode.thmtecnologia.com/componentes/orbit/): Ícones ou pequenos elementos que giram em círculos ao redor de um centro, como planetas em volta do Sol.

## Imagem e mídia

- [Audio Trimmer](https://vibecode.thmtecnologia.com/componentes/audio-trimmer/): Uma forma de onda com duas alças para escolher o trecho, ouvir o recorte, aplicar fades e baixar em WAV.
- [Audio Visualizer](https://vibecode.thmtecnologia.com/componentes/audio-visualizer/): Um disco cercado de barras que dançam com o som, ou linhas em ondas, tocando um som ambiente ou ouvindo o microfone.
- [Depth Scan](https://vibecode.thmtecnologia.com/componentes/depth-scan/): A foto começa como uma grade de pontos e uma onda de luz ciano passa por ela, revelando a imagem.
- [Dissolve](https://vibecode.thmtecnologia.com/componentes/dissolve/): A foto se desfaz em poeira de baixo para cima, com uma borda laranja que brilha como papel queimando.
- [Distort Hover](https://vibecode.thmtecnologia.com/componentes/distort-hover/): Ao passar o mouse, a foto se deforma como líquido e se transforma em uma segunda imagem.
- [Glitch Image](https://vibecode.thmtecnologia.com/componentes/glitch-image/): A imagem treme, se parte em faixas e separa as cores como um sinal de TV com defeito.
- [Halftone](https://vibecode.thmtecnologia.com/componentes/halftone/): A foto vira pontinhos de impressão, como jornal ou gibi, e uma lupa mostra a imagem original.
- [Image Particles](https://vibecode.thmtecnologia.com/componentes/image-particles/): A imagem é formada por milhares de pontinhos coloridos que se afastam do cursor e voltam ao lugar.
- [Infinite Canvas](https://vibecode.thmtecnologia.com/componentes/infinite-canvas/): Um mural sem fim de cartões com fotos que você arrasta em qualquer direção e abre em detalhe com um clique.
- [Liquid Glass](https://vibecode.thmtecnologia.com/componentes/thm-liquid-glass/): Uma placa de vidro arredondada desliza sobre a foto e curva a imagem nas bordas, como uma lente de verdade.
- [Masonry Lanes](https://vibecode.thmtecnologia.com/componentes/masonry-lanes/): Fotos de alturas diferentes encaixadas em colunas, com filtros por categoria que reorganizam tudo com animação.
- [Podcast Player](https://vibecode.thmtecnologia.com/componentes/podcast-player/): Player de podcast com capítulos na barra e uma transcrição que destaca e rola a frase que está tocando.
- [Relight](https://vibecode.thmtecnologia.com/componentes/relight/): Uma luz quente acompanha o mouse sobre a foto e revela relevo, brilho e sombras, como uma lanterna.
- [Shader Transition](https://vibecode.thmtecnologia.com/componentes/shader-transition/): Sequência de fotos que troca de imagem com ondas, pixels, redemoinho, queima, glitch ou círculo.
- [Stories](https://vibecode.thmtecnologia.com/componentes/stories/): Cartões verticais em tela de celular que passam sozinhos, com barrinhas de progresso no topo e toque para avançar.
- [Video Player](https://vibecode.thmtecnologia.com/componentes/video-player/): Player com barra de progresso, miniatura ao passar o mouse, capítulos, legendas, velocidade e tela cheia.
- [Video Timeline](https://vibecode.thmtecnologia.com/componentes/video-timeline/): Linha do tempo de edição com clipes que você arrasta, apara e divide, e um preview que mostra o resultado na hora.
- [Water Ripple](https://vibecode.thmtecnologia.com/componentes/water-ripple/): A foto fica debaixo de uma lâmina d'água que ondula com o mouse, com os cliques e com gotas de chuva.
- [Circular Gallery](https://vibecode.thmtecnologia.com/componentes/circular-gallery/): Fotos, logos ou ícones dispostos em roda que giram sem parar em volta do centro e podem pausar com o mouse.
- [Compare](https://vibecode.thmtecnologia.com/componentes/compare/): Duas imagens ou telas sobrepostas e uma linha no meio que você move com o mouse ou o dedo para comparar.
- [Expandable Gallery](https://vibecode.thmtecnologia.com/componentes/expandable-gallery/): Fotos lado a lado em faixas verticais; a que está sob o mouse se alarga e as outras se estreitam.
- [Images Slider](https://vibecode.thmtecnologia.com/componentes/images-slider/): Uma foto grande por vez, que sai deslizando e dá lugar à próxima, crescendo a partir do centro.
- [iPhone Mockup](https://vibecode.thmtecnologia.com/componentes/iphone-mockup/): Um iPhone desenhado em SVG, com a ilha no topo e o print do seu app ocupando a tela.
- [Lens](https://vibecode.thmtecnologia.com/componentes/lens/): Um círculo de aumento segue o mouse sobre a foto e mostra os detalhes ampliados, sem sair do lugar.
- [Particle Image](https://vibecode.thmtecnologia.com/componentes/particle-image/): Seu logo ou retrato se monta com pontinhos que voam até o lugar, fogem do mouse e depois voltam.
- [Photo Gallery](https://vibecode.thmtecnologia.com/componentes/photo-gallery/): Fotos recortadas em losango que se encaixam como um mosaico e viram quadrado inteiro ao passar o mouse.
- [Safari Mockup](https://vibecode.thmtecnologia.com/componentes/safari-mockup/): Uma janela do Safari desenhada em SVG, com barra de endereço e o print do seu site ocupando a página.

## Cartões e superfícies

- [Bottom Sheet](https://vibecode.thmtecnologia.com/componentes/bottom-sheet/): Um painel que sobe da parte de baixo da tela, para em três alturas e pode ser puxado com o dedo.
- [Color Picker Pro](https://vibecode.thmtecnologia.com/componentes/color-picker-pro/): Um seletor de cores completo, que mostra o que a tela consegue exibir, confere contraste e gera uma paleta.
- [Context Menu](https://vibecode.thmtecnologia.com/componentes/context-menu/): O menu que aparece no clique com o botão direito, com submenus, atalhos e opções marcáveis, no visual do seu app.
- [Onboarding Tour](https://vibecode.thmtecnologia.com/componentes/onboarding-tour/): Um tour de primeiro acesso que escurece a tela, destaca um elemento de cada vez e explica o que ele faz.
- [Toast Stack](https://vibecode.thmtecnologia.com/componentes/toast-stack/): Avisos que surgem no canto da tela, empilhados como cartas, e somem sozinhos ou com um arraste para o lado.
- [3D Card Effect](https://vibecode.thmtecnologia.com/componentes/3d-card/): Um cartão que inclina seguindo o mouse e faz imagem, título e botões saltarem em camadas de profundidade.
- [Apple Card Carousel](https://vibecode.thmtecnologia.com/componentes/apple-card-carousel/): Uma fileira de cartões altos com foto que rola para o lado e abre cada cartão num painel por cima da página.
- [Bento Grid](https://vibecode.thmtecnologia.com/componentes/bento-grid/): Seção dividida em blocos de tamanhos diferentes, como uma marmita japonesa, para apresentar recursos ou serviços.
- [Card Spotlight](https://vibecode.thmtecnologia.com/componentes/card-spotlight/): Um cartão com um brilho circular suave que acompanha o cursor e some quando o mouse sai.
- [Card Stack](https://vibecode.thmtecnologia.com/componentes/card-stack/): Cartões grandes que grudam no topo da tela e se empilham um sobre o outro conforme a página rola.
- [Direction Aware Hover Card](https://vibecode.thmtecnologia.com/componentes/direction-aware-hover/): Card de foto que mostra um texto por cima no hover e desliza a imagem conforme o lado por onde o cursor entrou.
- [Fey Cards](https://vibecode.thmtecnologia.com/componentes/fey-cards/): Leque de fotos altas atrás de um título grande: cada foto se revela no hover e o título fica vazado no meio.
- [Flip Card](https://vibecode.thmtecnologia.com/componentes/flip-card/): Cartão que gira 180 graus ao passar o mouse e mostra o verso, virando para o lado ou de cima para baixo.
- [Floating Card](https://vibecode.thmtecnologia.com/componentes/floating-card/): Card que se ergue, inclina em 3D e ganha um reflexo de luz seguindo o cursor, sobre uma sombra profunda.
- [Glare Card](https://vibecode.thmtecnologia.com/componentes/glare-card/): Card escuro que ganha um reflexo de luz e um brilho de holograma que seguem o mouse, com leve inclinação.

## Botões e cursores

- [Fluid Cursor](https://vibecode.thmtecnologia.com/componentes/fluid-cursor/): Rastro de tinta colorida e luminosa que escorre e se dissolve atrás do mouse, por cima da página inteira.
- [Gradient Button](https://vibecode.thmtecnologia.com/componentes/gradient-button/): Botão com uma borda fina de arco-íris que gira sem parar em volta do texto, com leve desfoque.
- [Image Trail Cursor](https://vibecode.thmtecnologia.com/componentes/image-trail-cursor/): Fotos que surgem uma após a outra atrás do cursor e logo somem, como um rastro de imagens.
- [Interactive Hover Button](https://vibecode.thmtecnologia.com/componentes/interactive-hover-button/): Botão em pílula com um ponto que cresce até preencher tudo no hover, enquanto o texto troca de lugar e ganha uma seta.
- [Rainbow Button](https://vibecode.thmtecnologia.com/componentes/rainbow-button/): Botão escuro com as cores do arco-íris correndo pela borda inferior e um reflexo colorido desfocado logo abaixo.
- [Ripple Button](https://vibecode.thmtecnologia.com/componentes/ripple-button/): Botão que solta um círculo de cor a partir do ponto exato do clique, que cresce e some em menos de um segundo.
- [Shimmer Button](https://vibecode.thmtecnologia.com/componentes/shimmer-button/): Botão preto em pílula com um feixe de luz que percorre a borda sem parar e um brilho interno que cresce no hover.
- [Sleek Line Cursor](https://vibecode.thmtecnologia.com/componentes/sleek-line-cursor/): Um feixe de linhas finas e coloridas persegue o cursor pela tela, ondulando como fios soltos ao vento.
- [Smooth Cursor](https://vibecode.thmtecnologia.com/componentes/smooth-cursor/): Troca a setinha do sistema por um cursor próprio que desliza atrás do mouse e gira na direção do movimento.
- [Tailed Cursor](https://vibecode.thmtecnologia.com/componentes/tailed-cursor/): Fitas largas em laranja, verde, amarelo e ciano perseguem o cursor dentro da área, com balanço de mola.

## Formulários e entrada

- [BR Form](https://vibecode.thmtecnologia.com/componentes/br-form/): Cadastro em etapas que formata e confere CPF, CNPJ, telefone, CEP e senha enquanto a pessoa preenche.
- [Date Range](https://vibecode.thmtecnologia.com/componentes/date-range/): Calendário em português com dois meses lado a lado para escolher data inicial e final, com atalhos e feriados.
- [Image Editor](https://vibecode.thmtecnologia.com/componentes/image-editor/): Editor de fotos dentro da página para recortar, girar, ajustar brilho e cor, aplicar filtros e exportar a imagem.
- [OTP Input](https://vibecode.thmtecnologia.com/componentes/otp-input/): Quadradinhos para digitar o código que chega por SMS, com colar inteiro, avanço automático e botão de reenviar.
- [Signature Pad](https://vibecode.thmtecnologia.com/componentes/signature-pad/): Área para a pessoa assinar com dedo, caneta ou mouse, com linha de base, nome, data e exportação da assinatura.
- [Balance Slider](https://vibecode.thmtecnologia.com/componentes/balance-slider/): Uma barra que se divide em duas partes coloridas, com a porcentagem de cada lado, como café e leite na xícara.
- [Color Picker](https://vibecode.thmtecnologia.com/componentes/color-picker/): Um botão que abre um painel para escolher cor no quadro de tons, digitar em HEX, RGB ou HSL e conferir o contraste.
- [File Upload](https://vibecode.thmtecnologia.com/componentes/file-upload/): Área para arrastar arquivos ou clicar e escolher, com um cartão que se levanta e a lista dos arquivos escolhidos.
- [Halo Search](https://vibecode.thmtecnologia.com/componentes/halo-search/): Campo de busca escuro cercado por anéis de luz azul e magenta que giram ao passar o mouse e ao clicar.
- [Input](https://vibecode.thmtecnologia.com/componentes/input/): Campo de texto cuja borda acende em azul no ponto por onde o cursor passa, como uma lanterna na moldura.
- [Placeholders And Vanish Input](https://vibecode.thmtecnologia.com/componentes/placeholders-and-vanish-input/): Campo em pílula com dicas que sobem e se alternam; ao enviar, o texto digitado se desfaz em pó.

## Dados e visualização

- [Activity Heatmap](https://vibecode.thmtecnologia.com/componentes/activity-heatmap/): Um ano inteiro em quadradinhos, um por dia, que ficam mais escuros nos dias com mais atividade.
- [Bar Race](https://vibecode.thmtecnologia.com/componentes/bar-race/): Barras horizontais que avançam período a período e trocam de lugar no ranking enquanto o tempo passa.
- [Brazil Map](https://vibecode.thmtecnologia.com/componentes/brazil-map/): As 27 UFs em hexágonos na posição do mapa real, com cor mais forte onde o número é maior.
- [Candlestick](https://vibecode.thmtecnologia.com/componentes/candlestick/): Gráfico de bolsa com velas verdes e vermelhas, volume embaixo, zoom pela roda do mouse e arraste para navegar.
- [Live Chart](https://vibecode.thmtecnologia.com/componentes/live-chart/): Gráfico de área com curva suave que recebe pontos novos a todo instante e desliza o eixo do tempo.
- [Odometer](https://vibecode.thmtecnologia.com/componentes/odometer/): Números grandes que rolam como os tambores do hodômetro de um carro e param com um leve balanço.
- [Pivot Table](https://vibecode.thmtecnologia.com/componentes/pivot-table/): Tabela que resume vendas por região, produto e trimestre; arraste os campos para mudar o cruzamento.
- [Radial Gauge](https://vibecode.thmtecnologia.com/componentes/radial-gauge/): Medidores em arco com faixas verde, âmbar e vermelha, ponteiro que balança até parar e número contando.
- [Sankey Flow](https://vibecode.thmtecnologia.com/componentes/sankey-flow/): Faixas curvas que mostram para onde vai cada parte de um total, com pontinhos correndo na proporção do volume.
- [Treemap](https://vibecode.thmtecnologia.com/componentes/treemap/): Um painel de retângulos coloridos, cada um do tamanho da sua fatia; clique para entrar no próximo nível.
- [Animated Circular Progress Bar](https://vibecode.thmtecnologia.com/componentes/animated-circular-progressbar/): Um anel que se preenche com animação até a porcentagem da meta, com o número no centro.
- [World Map](https://vibecode.thmtecnologia.com/componentes/world-map/): Um mapa do mundo feito de pontinhos, com arcos que se desenham entre cidades marcadas por pontos azuis.

## Aplicações e produtividade

- [Block Editor](https://vibecode.thmtecnologia.com/componentes/block-editor/): Editor de texto em blocos: digite barra para inserir títulos, listas e tarefas, e arraste cada bloco para reordenar.
- [Code Editor](https://vibecode.thmtecnologia.com/componentes/code-editor/): Editor de código com cores por linguagem, números de linha, busca e blocos que recolhem, direto na sua página.
- [Comments Layer](https://vibecode.thmtecnologia.com/componentes/comments-layer/): Pins numerados que você solta sobre uma imagem ou tela para comentar, responder e marcar como resolvido.
- [Data Grid](https://vibecode.thmtecnologia.com/componentes/data-grid/): Tabela que rola milhares de linhas sem travar, com filtros, ordenação, edição e copiar e colar com planilhas.
- [Diff Viewer](https://vibecode.thmtecnologia.com/componentes/diff-viewer/): Mostra o que mudou entre duas versões de um código ou texto, em vermelho e verde, para aceitar ou rejeitar cada trecho.
- [Flow Editor](https://vibecode.thmtecnologia.com/componentes/flow-editor/): Quadro infinito em que você liga caixas por fios para montar automações e vê o fluxo rodar com pulsos de luz.
- [Force Graph](https://vibecode.thmtecnologia.com/componentes/force-graph/): Milhares de pontos coloridos ligados por fios que se organizam sozinhos em grupos, com busca e zoom até cada nó.
- [Gantt](https://vibecode.thmtecnologia.com/componentes/gantt/): Cronograma de barras que você arrasta para mudar datas, com setas entre as tarefas e o caminho crítico em vermelho.
- [Kanban](https://vibecode.thmtecnologia.com/componentes/kanban/): Quadro de colunas com cartões que você arrasta entre etapas, com limite por coluna, prazos e prioridades.
- [Live Cursors](https://vibecode.thmtecnologia.com/componentes/live-cursors/): Setinhas coloridas com o nome de cada colega andando pelo documento, com trechos selecionados e recados no cursor.
- [Mind Map](https://vibecode.thmtecnologia.com/componentes/mind-map/): Ideia central no meio e ramos coloridos em curvas que você cria com Tab e Enter, arrasta e recolhe.
- [Org Chart](https://vibecode.thmtecnologia.com/componentes/org-chart/): Organograma que se monta sozinho em árvore, com equipes que abrem e fecham e busca que mostra o caminho até a pessoa.
- [Scheduler](https://vibecode.thmtecnologia.com/componentes/scheduler/): Agenda semanal de consultas em que você cria, move e estica horários arrastando, com uma cor por profissional.
- [Split Panes](https://vibecode.thmtecnologia.com/componentes/split-panes/): Tela dividida em áreas que você aumenta, diminui ou recolhe arrastando as linhas entre elas, como num editor de código.
- [Spreadsheet](https://vibecode.thmtecnologia.com/componentes/spreadsheet/): Planilha dentro do seu sistema, com células, barra de fórmulas e totais que se recalculam sozinhos.
- [Terminal](https://vibecode.thmtecnologia.com/componentes/terminal/): Janela de terminal escura em que a pessoa digita comandos, vê respostas coloridas e acompanha um deploy de demonstração.
- [Version Timeline](https://vibecode.thmtecnologia.com/componentes/version-timeline/): Linha do tempo das versões de um documento, com régua para voltar no tempo, comparação lado a lado e botão de restaurar.
- [Whiteboard](https://vibecode.thmtecnologia.com/componentes/whiteboard/): Quadro branco sem bordas para colar notas, desenhar formas, ligar setas e rabiscar à mão, como numa oficina ao vivo.
- [File Tree](https://vibecode.thmtecnologia.com/componentes/file-tree/): Lista de pastas e arquivos que abre e fecha com um clique, como o explorador de um editor de código.
- [Spring Calendar](https://vibecode.thmtecnologia.com/componentes/spring-calendar/): Um cartão com os dias em botões: ao escolher um dia, o cartão se estica com efeito de mola e mostra os eventos.

## Interfaces de IA

- [Agent Trace](https://vibecode.thmtecnologia.com/componentes/agent-trace/): Painel que mostra, passo a passo, o que a IA está pensando, quais ferramentas chamou e quanto tempo cada etapa levou.
- [Approval Card](https://vibecode.thmtecnologia.com/componentes/approval-card/): Cartão em que a pessoa revisa o que a IA vai fazer e segura o botão para aprovar, ou então rejeita ou edita o pedido.
- [Chat Thread](https://vibecode.thmtecnologia.com/componentes/chat-thread/): Conversa com a IA em que a resposta chega aos poucos, dá para gerar outra versão, editar a pergunta e avaliar.
- [Generative UI](https://vibecode.thmtecnologia.com/componentes/generative-ui/): Painel que a IA monta sozinha na tela, peça por peça, com métricas, gráficos, listas, formulários e botões.
- [Model Compare](https://vibecode.thmtecnologia.com/componentes/model-compare/): Dois modelos de IA respondem à mesma pergunta lado a lado, sem nome, e você vota antes de descobrir quem é quem.
- [Prompt Composer](https://vibecode.thmtecnologia.com/componentes/prompt-composer/): Caixa de mensagem de app de IA que cresce com o texto, aceita arquivos, grava áudio e abre comandos ao digitar barra.
- [Stream Text](https://vibecode.thmtecnologia.com/componentes/stream-text/): A resposta do assistente aparece aos poucos, palavra por palavra, saindo de um leve desfoque, como num chat de IA.
- [Voice Orb](https://vibecode.thmtecnologia.com/componentes/voice-orb/): Uma esfera luminosa que respira em espera e pulsa no ritmo da voz quando o assistente ouve ou fala.

## Comércio e conversão

- [Cart Drawer](https://vibecode.thmtecnologia.com/componentes/cart-drawer/): Carrinho que desliza pela lateral da loja, com cupom, cálculo de frete pelo CEP e barra de frete grátis.
- [Checkout BR](https://vibecode.thmtecnologia.com/componentes/checkout-br/): Pagamento em três etapas com QR Code do Pix, cartão parcelado e boleto, com o resumo do pedido ao lado.
- [Pricing Tiers](https://vibecode.thmtecnologia.com/componentes/pricing-tiers/): Cartões de planos lado a lado com troca entre mensal e anual, plano em destaque e comparação completa de recursos.
- [Product Gallery](https://vibecode.thmtecnologia.com/componentes/product-gallery/): Foto principal com lupa que amplia o detalhe ao passar o mouse, miniaturas embaixo e tela cheia com zoom.
- [Rating Reviews](https://vibecode.thmtecnologia.com/componentes/rating-reviews/): Bloco de avaliações de clientes com nota média em estrelas, barras por nota, filtros, ordenação e formulário.
- [Animate Grid](https://vibecode.thmtecnologia.com/componentes/animate-grid/): Uma grade de logos inclinada em 3D em que o logo sob o mouse salta para a frente e brilha em verde.
- [Animated Logo Cloud](https://vibecode.thmtecnologia.com/componentes/logo-cloud/): Uma faixa com os logos dos seus clientes passando devagar, numa cor só, abaixo de um título curto.
- [Animated Testimonials](https://vibecode.thmtecnologia.com/componentes/animated-testimonials/): Fotos de clientes empilhadas e levemente inclinadas, com a frase do depoimento surgindo palavra por palavra ao lado.
- [Design Testimonials](https://vibecode.thmtecnologia.com/componentes/design-testimonials/): Depoimento em letras grandes que surge palavra por palavra, com um número gigante ao fundo que segue o mouse.
- [Logo Origami](https://vibecode.thmtecnologia.com/componentes/logo-origami/): Um cartão que troca de logo a cada poucos segundos, dobrando ao meio como um painel de aeroporto antigo.
- [Testimonial Slider](https://vibecode.thmtecnologia.com/componentes/testimonial-slider/): Um depoimento por vez, com a foto redonda girando em arco ao trocar e a frase deslizando para o lugar.

## Navegação e scroll

- [Anchor Popover](https://vibecode.thmtecnologia.com/componentes/anchor-popover/): Balões de dica e menus presos ao botão que os abre, que mudam de lado sozinhos quando encostam na borda.
- [Command Palette](https://vibecode.thmtecnologia.com/componentes/command-palette/): Uma janela de busca que abre com Ctrl K ou ⌘K para achar páginas e executar ações sem tirar as mãos do teclado.
- [Dynamic Island](https://vibecode.thmtecnologia.com/componentes/dynamic-island/): Uma pílula preta no topo da tela que cresce e muda de formato para mostrar música, chamada, aviso ou cronômetro.
- [Horizontal Scroll](https://vibecode.thmtecnologia.com/componentes/horizontal-scroll/): Você rola para baixo e painéis com fotos e títulos grandes deslizam para o lado, com uma barra de progresso.
- [Magnetic Dock](https://vibecode.thmtecnologia.com/componentes/magnetic-dock/): Uma barra de ícones flutuante em que os ícones crescem perto do cursor e se deixam puxar por ele, como ímãs.
- [Morph Menu](https://vibecode.thmtecnologia.com/componentes/morph-menu/): Um menu de cabeçalho em que um único painel desliza e muda de tamanho ao passar de um item para outro.
- [Scroll Reveal](https://vibecode.thmtecnologia.com/componentes/scroll-reveal/): Um texto grande em que cada palavra sai do desfoque e fica nítida conforme você rola, no ritmo da leitura.
- [Scroll Video](https://vibecode.thmtecnologia.com/componentes/scroll-video/): Um produto desenhado em tempo real que gira, se separa em peças e volta a se montar conforme você rola.
- [Scrollytelling](https://vibecode.thmtecnologia.com/componentes/scrollytelling/): Uma imagem fixa ao lado do texto que troca, aproxima ou recorta conforme cada parte da história entra em foco.
- [View Transition](https://vibecode.thmtecnologia.com/componentes/view-transition/): Você clica num card da galeria e a foto e o título crescem suavemente até virar a página de detalhe.
- [Animated List](https://vibecode.thmtecnologia.com/componentes/animated-list/): Avisos que surgem um de cada vez no topo da lista e empurram os anteriores para baixo, como um feed ao vivo.
- [Animated Modal](https://vibecode.thmtecnologia.com/componentes/animated-modal/): Janela que se levanta da tela com um giro em 3D e um leve quique, sobre um fundo escurecido e desfocado.
- [Animated Tabs](https://vibecode.thmtecnologia.com/componentes/animated-tabs/): Abas em que um fundo arredondado desliza até a opção escolhida, com o conteúdo num maço de cartões.
- [Animated Tooltip](https://vibecode.thmtecnologia.com/componentes/animated-tooltip/): Fileira de fotos redondas sobrepostas; ao passar o mouse, um balão com nome e cargo surge e balança com o cursor.
- [Container Scroll](https://vibecode.thmtecnologia.com/componentes/container-scroll/): Uma tela de produto que começa inclinada para trás e fica de frente enquanto a página rola, com o título subindo.
- [Dock](https://vibecode.thmtecnologia.com/componentes/dock/): Barra de ícones translúcida em que cada ícone cresce quando o mouse se aproxima, como no Mac.
- [Marquee](https://vibecode.thmtecnologia.com/componentes/marquee/): Uma fileira de logos, depoimentos ou etiquetas que desliza em loop contínuo, na horizontal ou na vertical.
- [Morphing Tabs](https://vibecode.thmtecnologia.com/componentes/morphing-tabs/): Uma fileira de abas grudadas como um líquido, em que a aba escolhida se desprende como uma gota.
- [Multi Step Loader](https://vibecode.thmtecnologia.com/componentes/multi-step-loader/): Tela de espera que lista as etapas de um processo e marca cada uma como concluída enquanto avança.
- [Path Marquee](https://vibecode.thmtecnologia.com/componentes/path-marquee/): Fotos, logos ou palavras que deslizam sem parar ao longo de um caminho curvo e podem ser arrastadas.
- [Scroll Island](https://vibecode.thmtecnologia.com/componentes/scroll-island/): Uma pílula flutuante no topo da tela mostra quanto da página já foi lido e se abre num menu ao clicar.
- [Timeline](https://vibecode.thmtecnologia.com/componentes/timeline/): Uma linha vertical com marcos fixos que vai sendo preenchida por um feixe colorido conforme a página rola.
- [Tracing Beam](https://vibecode.thmtecnologia.com/componentes/tracing-beam/): Uma linha fina ao lado do texto ganha um feixe colorido que desce junto enquanto a pessoa lê e rola a página.