Components
Peças visuais, funcionais e interativas reutilizáveis. Diferentes de Patterns: Components entram dentro de seções e composições.
Make room
for the signal.
Ambient light gives a first impression enough space to land.
Explore the system ↗Aurora Background
Fundo Aurora oficial com gradientes atmosféricos animados, blur e máscara radial configurável.
intention.Animated beams support a decisive hero moment.
Background Beams
Beams animados em paths SVG para fundos de hero ou CTA.
ganham altitude.Direção clara para marcas em movimento.
Cloud Shader
Nuvens procedurais suaves que atravessam o céu com velocidade, quantidade e cores configuráveis.
for the signal.
Ambient structure for a hero, launch, or quiet point of focus.
Dotted Glow Background
Fundo pontilhado em canvas com brilho e opacidade animados por ponto.
for better ideas.Grid and dot background as quiet structure.
Grid & Dot Background
CSS background configurável com grid, dots ou combinação.
carry the mood.Animated color, grain and softness for a more tactile first impression.Explore the system ↗
Noise Background
Fundo dinâmico oficial com gradientes animados, textura de ruído e movimento suave.
with memory.
adds weight.
Noise Texture
Textura grain sutil para adicionar materialidade a fundos claros ou escuros.
deserves attention.Explore tools for building more expressive interfaces.
Spotlight
Spotlight radial para conduzir atenção a uma área do layout.
Make ideas visible.
Animated color gives one phrase a living focal point.
Aurora Text
Aplica gradiente aurora animado a trechos curtos de texto, com cores e velocidade configuráveis.
Turn attention into momentum
Gradient sweep makes one decisive phrase carry the hero.
Dia Text Reveal
Faixa horizontal de cor atravessa texto com brilho em gradiente e assenta na cor base.
Flip Words
Alterna palavras dentro de uma headline para comunicar possibilidades ou conceitos.
Make it move.
Moving line shadow gives one decisive phrase a pulse.
Line Shadow Text
Texto com linha de sombra móvel para headlines com energia visual.
Number Ticker
Contador numérico animado para transformar métricas estáticas em sinais de progresso.
Ideas that move people forward.
Character, word, line, blur, slide, scale. Motion gives message a pulse.
Text Animate
Anima texto por texto, palavra, caractere ou linha com presets de blur, slide, fade e scale.
Text Generate Effect
Revela texto progressivamente por palavras, com entrada e blur controláveis.
in layers.
Blur Fade
Entrada progressiva com direção, delay, offset, blur, duração e inView.
Stagger Reveal
Revela uma coleção de elementos em sequência com intervalo controlado.
Floating Navbar
Navbar flutuante que reage à direção do scroll e retorna quando necessário.
Sticky Header
Header sticky simples que muda discretamente ao iniciar o scroll.
Hover Border Gradient
Borda gradiente animada que expande no hover, preservando componente oficial Aceternity UI.
Magnetic Button
Botão deriva levemente em direção ao cursor e retorna com spring.
Shimmer Button
Shimmer percorre o perímetro do botão com efeito CSS controlado.
Card Spotlight
Card reage ao cursor com spotlight radial localizado.
Direction Aware Hover
Revela conteúdo de card a partir da direção de entrada do ponteiro.
the right way.Find the sharper angle.
visible.Design with a clear point of view.
Glowing Effect
Borda luminosa interativa que acompanha proximidade e direção do ponteiro.
point of view.
SVG Mask Effect
Reveal interativo através de máscara SVG para elementos visuais especiais.