Combina keyframes CSS com movimento parallax para criar sequências animadas. Neste exemplo, uma bolha flutua suavemente com animação CSS.
Uso de transformações 3D para simular profundidade arquitetônica. Demonstrado com um elemento que parece ter profundidade 3D usando perspectiva CSS.
Efeito clássico onde o fundo permanece fixo enquanto o conteúdo rola. Esta seção inteira tem um background fixo com conteúdo sobreposto.
Partículas luminosas que se movem em diferentes velocidades. As partículas são geradas dinamicamente com JavaScript.
Elementos que se deslocam em velocidades distintas. Neste exemplo, duas camadas se movem em velocidades diferentes para criar profundidade.
Elementos tipo cartão que se movem independentemente. Os mini cards flutuam com atrasos diferentes para criar um efeito ondulante.
Itens organizados em grade com movimento individual. Cada célula da grade tem uma animação própria com atrasos diferentes.
Uso de perspective e transform-style para efeitos 3D. A caixa é girada em eixos X e Y para simular profundidade.
Camadas com desfoque (blur) variável conforme o scroll. A camada de fundo está desfocada enquanto a frontal permanece nítida.
Divisão da tela em partes que se movem separadamente. As peças se movem independentemente para simular um quebra-cabeça animado.
Elementos que flutuam suavemente com o scroll. As bolhas se movem em padrões aleatórios para criar um efeito orgânico.
Sobreposição de imagens com transparência. Várias fotos são empilhadas com deslocamento para criar profundidade.
Cores que mudam de posição com o movimento. O gradiente se desloca suavemente criando um efeito de transição de cores.
Quadrícula com itens que reagem ao scroll. Passe o mouse sobre as células para ver o efeito de elevação.
Efeito de luzes e sobreposições semitransparentes. O card simula um display holográfico com pulsação de luz.
Uso de sombras e escalas para simular 3D. A caixa é renderizada com perspectiva para criar uma sensação de profundidade.
Múltiplas imagens sobrepostas com movimento independente. As imagens são deslocadas para criar um efeito de profundidade.
Elementos retangulares que se movem como "janelas". As mini janelas flutuam com um efeito ondulante.
Linhas que se esticam ou contraem com o scroll. As linhas centrais pulsam para criar um efeito dinâmico.
Efeito fluido que simula movimentos orgânicos. As bolhas líquidas se movem e mudam de forma aleatoriamente.
Formas que se transformam durante o scroll. O quadrado muda para círculo, triângulo e volta ao original.
Rolagem lateral com efeito parallax. O elemento se move horizontalmente através da tela em loop.
Efeito de luzes neon com brilho variável. O texto tem um brilho pulsante que simula luzes de neon.
Sobreposição de padrões com transparência. Duas texturas diagonais se sobrepõem criando um padrão complexo.
Repetição de formas com movimento sincronizado. O padrão diagonal se move continuamente criando um efeito dinâmico.
Pontos que se movem com o cursor ou scroll. As partículas são geradas dinamicamente com JavaScript.
Cubos ou formas geométricas com rotação parallax. Um cubo 3D completo que gira em todos os eixos.
Movimento em direção oposta ao scroll. O conteúdo se move para cima enquanto a página rola para baixo.
Girar itens conforme a página rola. O quadrado gira continuamente em 360 graus.
Animação ativada em pontos específicos do scroll. Passe o mouse sobre o card para ver o efeito.
Sombras que mudam de direção/intensidade. A sombra do quadrado se move alternando entre os lados.
Padrões que se deslocam continuamente. A textura de grade se move suavemente em duas direções.
Textos que se movem independentemente. O texto flutua suavemente para cima e para baixo.
Efeito de transparência com blur. O card tem um efeito de vidro fosco sobre uma imagem de fundo.
Movimento 360° com rolagem. A cena gira em 360 graus simulando uma experiência VR.
Aumento/diminuição de escala conforme o scroll. O elemento aumenta e diminui de tamanho continuamente.