Diretório
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 · 38
- Texto e tipografia · 41
- Efeitos especiais · 24
- Interação e física · 8
- 3D e espaço · 20
- Imagem e mídia · 27
- Cartões e superfícies · 15
- Botões e cursores · 10
- Formulários e entrada · 11
- Dados e visualização · 12
- Aplicações e produtividade · 20
- Interfaces de IA · 8
- Comércio e conversão · 11
- Navegação e scroll · 23
Fundos e atmosferas38 componentes
- AuroraCéu noturno com cortinas de luz verde e ciano que ondulam sobre estrelas e uma cadeia de montanhas.Exclusivo THM
- BoidsCentenas de setas finas voam juntas como um bando de pássaros e se espalham quando o cursor chega perto.Exclusivo THM
- CausticsReflexos de luz dançando como no fundo de uma piscina ao sol, com bordas levemente coloridas.Exclusivo THM
- Flow FieldMilhares de linhas finas correm em correntes curvas, como fios de seda ao vento, sobre um fundo claro.Exclusivo THM
- FluidTinta colorida que escorre e gira na tela atrás do conteúdo, empurrada pelo movimento do mouse.Exclusivo THM
- Glass OrbUma bola de vidro com um redemoinho de tinta índigo e ciano dentro, que gira devagar sobre um chão claro.Exclusivo THM
- GPU ParticlesCentenas de milhares de grãos finos correm em filamentos, como tinta no papel, e giram em volta do cursor.Exclusivo THM
- Liquid MetalUma gota de metal espelhado que pulsa devagar, muda de forma e se estica em direção ao cursor.Exclusivo THM
- Mesh GradientManchas de índigo, ciano e lavanda que se misturam e derivam devagar, com um grão leve de filme.Exclusivo THM
- MetaballsGotas brilhantes de cor índigo que se juntam e se separam como líquido, e uma delas segue o cursor.Exclusivo THM
- Reaction DiffusionManchas e ramos índigo crescem sozinhos como coral ou pele de animal, e o cursor planta novos focos.Exclusivo THM
- Aurora BackgroundFundo animado em CSS com faixas de luz azul e violeta que deslizam devagar, como uma aurora boreal.Adaptado
- Black Hole BackgroundAnéis e linhas finas formam um túnel que afunila para um ponto, com uma coluna de luz colorida no centro.Adaptado
- Bubbles BackgroundCentenas de bolhas em 3D sobem e descem devagar sobre um céu que muda de azul para laranja.Adaptado
- Cosmic PortalUm portal de ficção científica com núcleo de luz, anéis, cristais flutuantes e poeira estelar, girando no espaço.Adaptado
- Falling Stars BackgroundEstrelas que saem do centro da tela e correm para as bordas com rastro de luz, como uma nave acelerando.Adaptado
- Flickering GridGrade de quadradinhos que acendem e apagam ao acaso, em ritmo lento, como um painel de LED em repouso.Adaptado
- Interactive Grid PatternGrade de linhas finas em que cada quadrado acende quando o mouse passa e se apaga devagar, deixando um rastro.Adaptado
- Lamp EffectUma linha de luz ciano se acende no alto de uma seção escura e espalha brilho sobre o título logo abaixo.Adaptado
- Liquid BackgroundSuperfície líquida em rosa, lilás e verde-água que escorre e se dobra sem parar, como um holograma.Adaptado
- Neural BackgroundFios finos de luz azul se ramificam a partir de nós brilhantes sobre fundo preto, como neurônios acesos no escuro.Adaptado
- Particle WhirlpoolMilhares de partículas coloridas e brilhantes giram em enxame em volta de um ponto que segue o mouse.Adaptado
- Particles BackgroundPontinhos que flutuam devagar pelo fundo e deslizam de leve na direção do mouse, como poeira no ar.Adaptado
- Pattern BackgroundFundo de grade fina ou de pontos que some nas bordas e pode deslizar devagar numa direção.Adaptado
- Ribbon BackgroundCinco fitas coloridas em camadas, com sombras suaves, ondulando devagar de um lado a outro da tela.Adaptado
- RippleAnéis concêntricos que pulsam de dentro para fora atrás de um logo, ícone ou botão, como ondas num lago.Adaptado
- ScalesListras finas e discretas, na diagonal, na horizontal ou na vertical, que dão textura ao fundo de uma área.Adaptado
- Silk BackgroundTecido de cetim escuro com dobras diagonais que ondulam devagar, com brilho frio e textura de trama fina.Adaptado
- Singularity BackgroundUm anel de luz laranja e azul gira em volta de um centro escuro, como um buraco negro engolindo poeira cósmica.Adaptado
- Snowfall BackgroundFlocos de neve caindo devagar pelo fundo da página, com leve desvio para os lados, para campanhas de inverno.Adaptado
- SparklesPontinhos de luz que piscam e sobem devagar, como purpurina no ar, atrás de um título ou de toda a seção.Adaptado
- Stars BackgroundCéu noturno com estrelas de três tamanhos subindo devagar e se deslocando de leve quando o mouse passa.Adaptado
- Stractium BackgroundUma escultura abstrata de camadas finas flutua e se retorce num céu claro, iluminada por um sol.Adaptado
- TetrisQuadrados que caem devagar numa grade e se empilham no fundo, como no Tetris, e somem quando você clica.Adaptado
- Thunderstorm BackgroundNuvens escuras de tempestade iluminadas por dentro por raios azuis, dourados e brancos que vêm e vão.Adaptado
- Vortex BackgroundCentenas de pontinhos neon em azul, violeta e magenta fluindo em correntes curvas sobre um fundo escuro.Adaptado
- Warp BackgroundUm card no centro de um túnel de grade em 3D, com faixas de luz coloridas correndo pelas paredes até as bordas.Adaptado
- Wavy BackgroundCinco ondas de luz neon, grossas e desfocadas, ondulando sem parar no meio de um fundo escuro.Adaptado
Texto e tipografia41 componentes
- AssinaturaUma assinatura caligráfica que aparece traço a traço, como se uma caneta invisível escrevesse na tela.Exclusivo THM
- Decode TextTítulo que surge embaralhado em letras, números e símbolos e vai se acertando até formar a frase.Exclusivo THM
- Gooey TextPalavras que se revezam no título, derretendo uma na outra como gotas que se juntam antes de ficarem nítidas.Exclusivo THM
- Kinetic TextUma frase repetida corre sem parar sobre um nó tridimensional que gira devagar e inclina com o mouse.Exclusivo THM
- Particle TextUma palavra desenhada com milhares de pontinhos coloridos que se espalham quando o mouse passa e voltam ao lugar.Exclusivo THM
- Text ShatterUm título que se parte em centenas de cacos ao clicar ou passar o mouse e se monta de novo sozinho.Exclusivo THM
- Variable WaveUm título em que cada letra fica mais fina ou mais grossa numa onda contínua e engrossa perto do mouse.Exclusivo THM
- 3D TextLetras brancas com contorno preto grosso e sombra amarela deslocada, balançando de leve como letreiro de desenho.Adaptado
- Blur RevealTítulos e parágrafos que aparecem um depois do outro, saindo de um borrão e subindo de leve até ficarem nítidos.Adaptado
- Box RevealUm bloco de cor cobre o título e recolhe para o lado, deixando o texto aparecer subindo de leve.Adaptado
- Breathing TextTexto em fonte variável em que as letras engrossam e afinam uma após a outra, como se a palavra respirasse.Adaptado
- Colourful TextUma palavra do título em que cada letra ganha uma cor viva e as cores se embaralham a cada cinco segundos.Adaptado
- Container Text FlipUma palavra dentro de uma caixa em relevo que troca sozinha, e a caixa estica ou encolhe para caber a nova.Adaptado
- Encrypted TextFrase que surge como símbolos sorteados e se revela letra por letra, da esquerda para a direita.Adaptado
- Flip WordsUma palavra no meio do título troca sozinha a cada poucos segundos, com a nova entrando letra por letra.Adaptado
- FocusFrase com as palavras borradas, em que uma moldura de câmera deixa nítida uma palavra de cada vez.Adaptado
- Highlight TextUma faixa de cor cresce atrás de um trecho do texto, como um marca-texto passando sobre a frase.Adaptado
- Hyper TextPalavra em maiúsculas que embaralha as letras ao passar o mouse e se forma de novo em menos de um segundo.Adaptado
- Letter PullupTítulo que entra na página com cada letra subindo de baixo, uma depois da outra, como uma onda.Adaptado
- Letter SwapAo passar o mouse, cada letra desliza na vertical e dá lugar a uma cópia, numa onda que atravessa a palavra.Adaptado
- Line Shadow TextPalavra com uma sombra feita de listras diagonais finas, que deslizam devagar atrás das letras.Adaptado
- Media TextUma frase em duas partes que se afastam para abrir espaço a uma foto ou a um vídeo pequeno no meio.Adaptado
- Morphing TextUma palavra derrete e se transforma na próxima, com as letras se fundindo como gotas de tinta.Adaptado
- Number TickerNúmero que parte do zero e corre até o valor final quando aparece na tela, como um placar.Adaptado
- Radiant TextTexto em cinza suave com uma faixa de brilho que atravessa as letras de tempos em tempos.Adaptado
- Screw TextAo passar o mouse, cada letra gira como um pequeno cubo, uma depois da outra, numa onda em 3D.Adaptado
- Scroll Swap TextCada linha de texto rola na vertical e dá lugar a uma cópia idêntica, no ritmo da rolagem.Adaptado
- Sparkles TextEstrelinhas violeta e rosa piscam e giram por cima da palavra, aparecendo e sumindo sem parar.Adaptado
- Spinning TextUma frase curta dá a volta num círculo e gira sem parar, como um selo carimbado ao lado do botão.Adaptado
- Text Generate EffectAs palavras saem do desfoque e aparecem uma depois da outra, como se o texto estivesse sendo gerado na hora.Adaptado
- Text GlitchFaixas do título aparecem deslocadas para os lados com rastros vermelho e ciano, como uma tela com defeito.Adaptado
- Text HighlightUma faixa de cor preenche o fundo da palavra da esquerda para a direita, como uma caneta marca-texto.Adaptado
- Text Hover EffectUma palavra gigante só em contorno aparece quando o mouse passa e ganha, perto do cursor, as cores que você definir.Adaptado
- Text RevealCada linha do parágrafo sobe de trás de uma borda invisível e aparece em sequência, com parada suave.Adaptado
- Text Reveal CardDuas frases no mesmo lugar: uma linha vertical segue o mouse e mostra a outra frase de um lado dela.Adaptado
- Text Scroll RevealA frase fica fixa na tela e cada palavra passa do cinza apagado à cor cheia conforme você rola.Adaptado
- Typewriter TextAs letras aparecem uma a uma com um cursor piscando, somem e dão lugar à próxima palavra da lista.Adaptado
- Underline TextUma linha fina surge embaixo da palavra quando o mouse passa, crescendo do centro ou atravessando de um lado ao outro.Adaptado
- Variable Letter TextAo passar o mouse, as letras ficam mais grossas uma de cada vez, numa onda que percorre a palavra.Adaptado
- Variable TextAs letras perto do mouse engrossam e as mais distantes continuam finas, numa mancha de negrito que segue o cursor.Adaptado
- Video TextUm título em letras grandes com um vídeo tocando por dentro, como se as letras fossem janelas para a cena.Adaptado
Efeitos especiais24 componentes
- Border BeamCartão com um feixe de luz que dá voltas pela borda e um brilho suave que acompanha o mouse por dentro.Exclusivo THM
- Animated BeamLinhas finas ligam ícones e cards, e um pulso de luz colorida corre por elas, mostrando os dados em movimento.Adaptado
- Border BeamUm pequeno feixe de luz colorida dá voltas pela borda de um card ou seção, como um cometa contornando a moldura.Adaptado
- ConfettiUma explosão de papeizinhos coloridos sobe e cai na tela quando a pessoa conclui uma compra, um cadastro ou uma meta.Adaptado
- Dither ShaderTransforma uma foto em padrão de pontinhos de poucas cores, com cara de jogo antigo ou de impressão retrô.Adaptado
- FloatQualquer imagem ou ícone passa a boiar devagar, subindo, descendo e girando de leve, sem parar.Adaptado
- Glow BorderUm brilho colorido passeia devagar pela borda de um card ou campo, acendendo um trecho e depois outro.Adaptado
- Glowing EffectQuando o mouse chega perto de um card, um arco de luz colorida acende na borda e gira para apontar o cursor.Adaptado
- HTML ASCIIO conteúdo real da página é redesenhado ao vivo como arte ASCII, com caracteres que imitam luz e sombra.Adaptado
- HTML BlazeChamas sobem da base da página, o calor faz o conteúdo ondular e faíscas laranja voam para cima.Adaptado
- HTML ChromaticAo 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.Adaptado
- HTML ClothO conteúdo da página se dobra e ondula devagar, como um pano leve balançando com a brisa.Adaptado
- HTML DragAo girar a roda do mouse sobre ele, o conteúdo se curva como uma folha de papel e depois volta ao lugar.Adaptado
- HTML in CanvasSeu HTML de verdade passa por um efeito gráfico da placa de vídeo, como ondas de água, e segue clicável.Adaptado
- HTML LiquidO conteúdo da página parece estar sob uma lâmina d'água e solta ondas por onde o mouse passa.Adaptado
- Images BadgeUm selo com ícone de pasta amarela: ao passar o mouse, a pasta abre e até três fotos saltam em leque.Adaptado
- Liquid Glass EffectUm painel de vidro que entorta o conteúdo que passa por trás, com bordas que refratam e separam as cores.Adaptado
- Liquid LogoSeu logo vira uma peça de metal espelhado, com reflexos que escorrem devagar pela superfície.Adaptado
- MeteorsPequenos riscos com cauda atravessam o card na diagonal, como estrelas cadentes, cada um no seu ritmo.Adaptado
- Neon BorderUma borda fina com luz azul e rosa que gira em volta do campo ou do botão, como um letreiro de neon.Adaptado
- Progressive BlurA imagem ou o conteúdo vai ficando embaçado aos poucos até a borda, como um vidro cada vez mais fosco.Adaptado
- Scratch To RevealUm cartão coberto por uma camada colorida que a pessoa raspa com o mouse ou o dedo para descobrir o prêmio.Adaptado
- Shader Toy ViewerUma tela que roda efeitos visuais escritos em GLSL, como campos de estrelas e vórtices, e reage ao mouse.Adaptado
- SVG MaskUm círculo que segue o mouse e, sobre o título, cresce para revelar uma segunda mensagem escondida.Adaptado
Interação e física8 componentes
- Card StackPilha de fotos em que você arrasta o cartão de cima para o lado e ele volta para o fundo com efeito de mola.Exclusivo THM
- Elastic SliderBarra de ajuste em que o trilho estica como elástico quando você puxa além do fim e volta balançando.Exclusivo THM
- Elastic TrailUma fita colorida, grossa na cabeça e fina na ponta, que persegue o mouse como uma serpente.Exclusivo THM
- Gravity TagsPílulas com nomes de serviços despencam na tela, batem umas nas outras e empilham; dá para arrastar e jogar.Exclusivo THM
- Holo CardCartão com arte que inclina em 3D sob o mouse e brilha com reflexo arco-íris, como uma carta colecionável rara.Exclusivo THM
- Morph BlobUma bolha em gradiente que muda de contorno devagar, como se respirasse, e se estica na direção do mouse.Exclusivo THM
- Rope MobileFios finos presos num trilho no alto, com cartões ou formas na ponta, que balançam ao vento e podem ser puxados.Exclusivo THM
- Parallax FloatFotos e elementos espalhados que se deslocam em velocidades diferentes conforme o mouse, criando profundidade.Adaptado
3D e espaço20 componentes
- ASCII RenderUma forma 3D girando na tela, desenhada ao vivo com letras e símbolos de terminal em vez de pixels.Exclusivo THM
- Carrossel 3DFotos dispostas em roda, como num cilindro, que você gira arrastando, com inércia e reflexo no chão.Exclusivo THM
- ClothSua imagem vira uma bandeira de tecido que ondula ao vento e pode ser puxada com o mouse ou com o dedo.Exclusivo THM
- Gallery TunnelUm corredor sem fim com quadros nas duas paredes, que você percorre com a roda do mouse, arrastando ou pelas setas.Exclusivo THM
- Globe ConnectionsGlobo de pontinhos que gira sozinho, com arcos de luz ligando 12 cidades reais pelo mundo.Exclusivo THM
- Instanced ClusterUm monte de bolas e cubos foscos que se apertam no centro e abrem caminho quando o mouse passa.Exclusivo THM
- OceanMar calmo ao pôr do sol, com ondas em movimento, reflexo dourado do sol e uma boia balançando.Exclusivo THM
- Particle MorphMilhares de pontinhos que voam e se reorganizam em esfera, anel, cubo e no texto que você escolher.Exclusivo THM
- Product ConfiguratorUma garrafa em 3D que gira com o dedo ou o mouse, troca de cor e acabamento e atualiza o preço na hora.Exclusivo THM
- Raymarch BlobUma forma líquida em 3D que ondula, se funde com um anel e duas cápsulas e gira conforme o mouse.Exclusivo THM
- 3D CarouselPainéis de imagem grandes dispostos em anel, girando sem parar à sua volta, que você pode arrastar.Adaptado
- Bending GalleryFotos em fileira sobre uma curva, que deslizam com arrasto ou rolagem e ondulam de leve ao se mover.Adaptado
- BookCapa de livro em 3D feita só com CSS, que gira de lado no hover e revela a borda branca das páginas.Adaptado
- Cube CarouselUm cubo que gira com o arraste e mostra uma foto ou um vídeo em cada face.Adaptado
- Github GlobeGlobo azul com países feitos de hexágonos e arcos coloridos que cruzam o planeta, no estilo do GitHub.Adaptado
- GlobeGlobo claro de pontinhos com marcadores laranja em grandes cidades, girando devagar e fácil de arrastar.Adaptado
- Icon CloudBola de ícones redondos girando em 3D, que segue o mouse e traz para a frente o ícone clicado.Adaptado
- Infinite GridUma parede de cartões com imagem que você arrasta para qualquer lado, sem nunca chegar ao fim.Adaptado
- Light SpeedUma estrada noturna com rastros de faróis passando em alta velocidade, que acelera quando você segura o clique.Adaptado
- OrbitÍcones ou pequenos elementos que giram em círculos ao redor de um centro, como planetas em volta do Sol.Adaptado
Imagem e mídia27 componentes
- Audio TrimmerUma forma de onda com duas alças para escolher o trecho, ouvir o recorte, aplicar fades e baixar em WAV.Exclusivo THM
- Audio VisualizerUm disco cercado de barras que dançam com o som, ou linhas em ondas, tocando um som ambiente ou ouvindo o microfone.Exclusivo THM
- Depth ScanA foto começa como uma grade de pontos e uma onda de luz ciano passa por ela, revelando a imagem.Exclusivo THM
- DissolveA foto se desfaz em poeira de baixo para cima, com uma borda laranja que brilha como papel queimando.Exclusivo THM
- Distort HoverAo passar o mouse, a foto se deforma como líquido e se transforma em uma segunda imagem.Exclusivo THM
- Glitch ImageA imagem treme, se parte em faixas e separa as cores como um sinal de TV com defeito.Exclusivo THM
- HalftoneA foto vira pontinhos de impressão, como jornal ou gibi, e uma lupa mostra a imagem original.Exclusivo THM
- Image ParticlesA imagem é formada por milhares de pontinhos coloridos que se afastam do cursor e voltam ao lugar.Exclusivo THM
- Infinite CanvasUm mural sem fim de cartões com fotos que você arrasta em qualquer direção e abre em detalhe com um clique.Exclusivo THM
- Liquid GlassUma placa de vidro arredondada desliza sobre a foto e curva a imagem nas bordas, como uma lente de verdade.Exclusivo THM
- Masonry LanesFotos de alturas diferentes encaixadas em colunas, com filtros por categoria que reorganizam tudo com animação.Exclusivo THM
- Podcast PlayerPlayer de podcast com capítulos na barra e uma transcrição que destaca e rola a frase que está tocando.Exclusivo THM
- RelightUma luz quente acompanha o mouse sobre a foto e revela relevo, brilho e sombras, como uma lanterna.Exclusivo THM
- Shader TransitionSequência de fotos que troca de imagem com ondas, pixels, redemoinho, queima, glitch ou círculo.Exclusivo THM
- StoriesCartões verticais em tela de celular que passam sozinhos, com barrinhas de progresso no topo e toque para avançar.Exclusivo THM
- Video PlayerPlayer com barra de progresso, miniatura ao passar o mouse, capítulos, legendas, velocidade e tela cheia.Exclusivo THM
- Video TimelineLinha do tempo de edição com clipes que você arrasta, apara e divide, e um preview que mostra o resultado na hora.Exclusivo THM
- Water RippleA foto fica debaixo de uma lâmina d'água que ondula com o mouse, com os cliques e com gotas de chuva.Exclusivo THM
- Circular GalleryFotos, logos ou ícones dispostos em roda que giram sem parar em volta do centro e podem pausar com o mouse.Adaptado
- CompareDuas imagens ou telas sobrepostas e uma linha no meio que você move com o mouse ou o dedo para comparar.Adaptado
- Expandable GalleryFotos lado a lado em faixas verticais; a que está sob o mouse se alarga e as outras se estreitam.Adaptado
- Images SliderUma foto grande por vez, que sai deslizando e dá lugar à próxima, crescendo a partir do centro.Adaptado
- iPhone MockupUm iPhone desenhado em SVG, com a ilha no topo e o print do seu app ocupando a tela.Adaptado
- LensUm círculo de aumento segue o mouse sobre a foto e mostra os detalhes ampliados, sem sair do lugar.Adaptado
- Particle ImageSeu logo ou retrato se monta com pontinhos que voam até o lugar, fogem do mouse e depois voltam.Adaptado
- Photo GalleryFotos recortadas em losango que se encaixam como um mosaico e viram quadrado inteiro ao passar o mouse.Adaptado
- Safari MockupUma janela do Safari desenhada em SVG, com barra de endereço e o print do seu site ocupando a página.Adaptado
Cartões e superfícies15 componentes
- Bottom SheetUm painel que sobe da parte de baixo da tela, para em três alturas e pode ser puxado com o dedo.Exclusivo THM
- Color Picker ProUm seletor de cores completo, que mostra o que a tela consegue exibir, confere contraste e gera uma paleta.Exclusivo THM
- Context MenuO menu que aparece no clique com o botão direito, com submenus, atalhos e opções marcáveis, no visual do seu app.Exclusivo THM
- Onboarding TourUm tour de primeiro acesso que escurece a tela, destaca um elemento de cada vez e explica o que ele faz.Exclusivo THM
- Toast StackAvisos que surgem no canto da tela, empilhados como cartas, e somem sozinhos ou com um arraste para o lado.Exclusivo THM
- 3D Card EffectUm cartão que inclina seguindo o mouse e faz imagem, título e botões saltarem em camadas de profundidade.Adaptado
- Apple Card CarouselUma fileira de cartões altos com foto que rola para o lado e abre cada cartão num painel por cima da página.Adaptado
- Bento GridSeção dividida em blocos de tamanhos diferentes, como uma marmita japonesa, para apresentar recursos ou serviços.Adaptado
- Card SpotlightUm cartão com um brilho circular suave que acompanha o cursor e some quando o mouse sai.Adaptado
- Card StackCartões grandes que grudam no topo da tela e se empilham um sobre o outro conforme a página rola.Adaptado
- Direction Aware Hover CardCard de foto que mostra um texto por cima no hover e desliza a imagem conforme o lado por onde o cursor entrou.Adaptado
- Fey CardsLeque de fotos altas atrás de um título grande: cada foto se revela no hover e o título fica vazado no meio.Adaptado
- Flip CardCartão que gira 180 graus ao passar o mouse e mostra o verso, virando para o lado ou de cima para baixo.Adaptado
- Floating CardCard que se ergue, inclina em 3D e ganha um reflexo de luz seguindo o cursor, sobre uma sombra profunda.Adaptado
- Glare CardCard escuro que ganha um reflexo de luz e um brilho de holograma que seguem o mouse, com leve inclinação.Adaptado
Botões e cursores10 componentes
- Fluid CursorRastro de tinta colorida e luminosa que escorre e se dissolve atrás do mouse, por cima da página inteira.Adaptado
- Gradient ButtonBotão com uma borda fina de arco-íris que gira sem parar em volta do texto, com leve desfoque.Adaptado
- Image Trail CursorFotos que surgem uma após a outra atrás do cursor e logo somem, como um rastro de imagens.Adaptado
- Interactive Hover ButtonBotão em pílula com um ponto que cresce até preencher tudo no hover, enquanto o texto troca de lugar e ganha uma seta.Adaptado
- Rainbow ButtonBotão escuro com as cores do arco-íris correndo pela borda inferior e um reflexo colorido desfocado logo abaixo.Adaptado
- Ripple ButtonBotão que solta um círculo de cor a partir do ponto exato do clique, que cresce e some em menos de um segundo.Adaptado
- Shimmer ButtonBotão preto em pílula com um feixe de luz que percorre a borda sem parar e um brilho interno que cresce no hover.Adaptado
- Sleek Line CursorUm feixe de linhas finas e coloridas persegue o cursor pela tela, ondulando como fios soltos ao vento.Adaptado
- Smooth CursorTroca a setinha do sistema por um cursor próprio que desliza atrás do mouse e gira na direção do movimento.Adaptado
- Tailed CursorFitas largas em laranja, verde, amarelo e ciano perseguem o cursor dentro da área, com balanço de mola.Adaptado
Formulários e entrada11 componentes
- BR FormCadastro em etapas que formata e confere CPF, CNPJ, telefone, CEP e senha enquanto a pessoa preenche.Exclusivo THM
- Date RangeCalendário em português com dois meses lado a lado para escolher data inicial e final, com atalhos e feriados.Exclusivo THM
- Image EditorEditor de fotos dentro da página para recortar, girar, ajustar brilho e cor, aplicar filtros e exportar a imagem.Exclusivo THM
- OTP InputQuadradinhos para digitar o código que chega por SMS, com colar inteiro, avanço automático e botão de reenviar.Exclusivo THM
- Signature PadÁrea para a pessoa assinar com dedo, caneta ou mouse, com linha de base, nome, data e exportação da assinatura.Exclusivo THM
- Balance SliderUma barra que se divide em duas partes coloridas, com a porcentagem de cada lado, como café e leite na xícara.Adaptado
- Color PickerUm botão que abre um painel para escolher cor no quadro de tons, digitar em HEX, RGB ou HSL e conferir o contraste.Adaptado
- File UploadÁrea para arrastar arquivos ou clicar e escolher, com um cartão que se levanta e a lista dos arquivos escolhidos.Adaptado
- Halo SearchCampo de busca escuro cercado por anéis de luz azul e magenta que giram ao passar o mouse e ao clicar.Adaptado
- InputCampo de texto cuja borda acende em azul no ponto por onde o cursor passa, como uma lanterna na moldura.Adaptado
- Placeholders And Vanish InputCampo em pílula com dicas que sobem e se alternam; ao enviar, o texto digitado se desfaz em pó.Adaptado
Dados e visualização12 componentes
- Activity HeatmapUm ano inteiro em quadradinhos, um por dia, que ficam mais escuros nos dias com mais atividade.Exclusivo THM
- Bar RaceBarras horizontais que avançam período a período e trocam de lugar no ranking enquanto o tempo passa.Exclusivo THM
- Brazil MapAs 27 UFs em hexágonos na posição do mapa real, com cor mais forte onde o número é maior.Exclusivo THM
- CandlestickGráfico de bolsa com velas verdes e vermelhas, volume embaixo, zoom pela roda do mouse e arraste para navegar.Exclusivo THM
- Live ChartGráfico de área com curva suave que recebe pontos novos a todo instante e desliza o eixo do tempo.Exclusivo THM
- OdometerNúmeros grandes que rolam como os tambores do hodômetro de um carro e param com um leve balanço.Exclusivo THM
- Pivot TableTabela que resume vendas por região, produto e trimestre; arraste os campos para mudar o cruzamento.Exclusivo THM
- Radial GaugeMedidores em arco com faixas verde, âmbar e vermelha, ponteiro que balança até parar e número contando.Exclusivo THM
- Sankey FlowFaixas curvas que mostram para onde vai cada parte de um total, com pontinhos correndo na proporção do volume.Exclusivo THM
- TreemapUm painel de retângulos coloridos, cada um do tamanho da sua fatia; clique para entrar no próximo nível.Exclusivo THM
- Animated Circular Progress BarUm anel que se preenche com animação até a porcentagem da meta, com o número no centro.Adaptado
- World MapUm mapa do mundo feito de pontinhos, com arcos que se desenham entre cidades marcadas por pontos azuis.Adaptado
Aplicações e produtividade20 componentes
- Block EditorEditor de texto em blocos: digite barra para inserir títulos, listas e tarefas, e arraste cada bloco para reordenar.Exclusivo THM
- Code EditorEditor de código com cores por linguagem, números de linha, busca e blocos que recolhem, direto na sua página.Exclusivo THM
- Comments LayerPins numerados que você solta sobre uma imagem ou tela para comentar, responder e marcar como resolvido.Exclusivo THM
- Data GridTabela que rola milhares de linhas sem travar, com filtros, ordenação, edição e copiar e colar com planilhas.Exclusivo THM
- Diff ViewerMostra o que mudou entre duas versões de um código ou texto, em vermelho e verde, para aceitar ou rejeitar cada trecho.Exclusivo THM
- Flow EditorQuadro infinito em que você liga caixas por fios para montar automações e vê o fluxo rodar com pulsos de luz.Exclusivo THM
- Force GraphMilhares de pontos coloridos ligados por fios que se organizam sozinhos em grupos, com busca e zoom até cada nó.Exclusivo THM
- GanttCronograma de barras que você arrasta para mudar datas, com setas entre as tarefas e o caminho crítico em vermelho.Exclusivo THM
- KanbanQuadro de colunas com cartões que você arrasta entre etapas, com limite por coluna, prazos e prioridades.Exclusivo THM
- Live CursorsSetinhas coloridas com o nome de cada colega andando pelo documento, com trechos selecionados e recados no cursor.Exclusivo THM
- Mind MapIdeia central no meio e ramos coloridos em curvas que você cria com Tab e Enter, arrasta e recolhe.Exclusivo THM
- Org ChartOrganograma que se monta sozinho em árvore, com equipes que abrem e fecham e busca que mostra o caminho até a pessoa.Exclusivo THM
- SchedulerAgenda semanal de consultas em que você cria, move e estica horários arrastando, com uma cor por profissional.Exclusivo THM
- Split PanesTela dividida em áreas que você aumenta, diminui ou recolhe arrastando as linhas entre elas, como num editor de código.Exclusivo THM
- SpreadsheetPlanilha dentro do seu sistema, com células, barra de fórmulas e totais que se recalculam sozinhos.Exclusivo THM
- TerminalJanela de terminal escura em que a pessoa digita comandos, vê respostas coloridas e acompanha um deploy de demonstração.Exclusivo THM
- Version TimelineLinha 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.Exclusivo THM
- WhiteboardQuadro branco sem bordas para colar notas, desenhar formas, ligar setas e rabiscar à mão, como numa oficina ao vivo.Exclusivo THM
- File TreeLista de pastas e arquivos que abre e fecha com um clique, como o explorador de um editor de código.Adaptado
- Spring CalendarUm 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.Adaptado
Interfaces de IA8 componentes
- Agent TracePainel que mostra, passo a passo, o que a IA está pensando, quais ferramentas chamou e quanto tempo cada etapa levou.Exclusivo THM
- Approval CardCartã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.Exclusivo THM
- Chat ThreadConversa com a IA em que a resposta chega aos poucos, dá para gerar outra versão, editar a pergunta e avaliar.Exclusivo THM
- Generative UIPainel que a IA monta sozinha na tela, peça por peça, com métricas, gráficos, listas, formulários e botões.Exclusivo THM
- Model CompareDois modelos de IA respondem à mesma pergunta lado a lado, sem nome, e você vota antes de descobrir quem é quem.Exclusivo THM
- Prompt ComposerCaixa de mensagem de app de IA que cresce com o texto, aceita arquivos, grava áudio e abre comandos ao digitar barra.Exclusivo THM
- Stream TextA resposta do assistente aparece aos poucos, palavra por palavra, saindo de um leve desfoque, como num chat de IA.Exclusivo THM
- Voice OrbUma esfera luminosa que respira em espera e pulsa no ritmo da voz quando o assistente ouve ou fala.Exclusivo THM
Comércio e conversão11 componentes
- Cart DrawerCarrinho que desliza pela lateral da loja, com cupom, cálculo de frete pelo CEP e barra de frete grátis.Exclusivo THM
- Checkout BRPagamento em três etapas com QR Code do Pix, cartão parcelado e boleto, com o resumo do pedido ao lado.Exclusivo THM
- Pricing TiersCartões de planos lado a lado com troca entre mensal e anual, plano em destaque e comparação completa de recursos.Exclusivo THM
- Product GalleryFoto principal com lupa que amplia o detalhe ao passar o mouse, miniaturas embaixo e tela cheia com zoom.Exclusivo THM
- Rating ReviewsBloco de avaliações de clientes com nota média em estrelas, barras por nota, filtros, ordenação e formulário.Exclusivo THM
- Animate GridUma grade de logos inclinada em 3D em que o logo sob o mouse salta para a frente e brilha em verde.Adaptado
- Animated Logo CloudUma faixa com os logos dos seus clientes passando devagar, numa cor só, abaixo de um título curto.Adaptado
- Animated TestimonialsFotos de clientes empilhadas e levemente inclinadas, com a frase do depoimento surgindo palavra por palavra ao lado.Adaptado
- Design TestimonialsDepoimento em letras grandes que surge palavra por palavra, com um número gigante ao fundo que segue o mouse.Adaptado
- Logo OrigamiUm cartão que troca de logo a cada poucos segundos, dobrando ao meio como um painel de aeroporto antigo.Adaptado
- Testimonial SliderUm depoimento por vez, com a foto redonda girando em arco ao trocar e a frase deslizando para o lugar.Adaptado
Deixe a sua IA com repertório de estúdio
268 componentes Vue e Nuxt, 115 exclusivos, prompt pronto em todos. Pagamento único, acesso vitalício e 7 dias de garantia.