Bem-vindo ao meu repositório de animações, onde eu explorei e criei uma variedade de pequenos projetos animados utilizando CSS e JavaScript. Cada projeto é uma demonstração única, mostrando diferentes técnicas e conceitos de animação que eu explorei ao longo do tempo.
Neste projeto temos diversos tipos de carrosseis
Um carrosel infinito que pode ser movido para ambas as direções utilizando as setas nas extremidades externas da carta em foco.
Acesse os codigos Clicando aqui
Um carrosel infinito que pode ser movido para ambas as direções utilizando as setas nas extremidades externas da carta em foco.
Acesse os codigos Clicando aqui
Um carrosel infinito que pode ser movido para ambas as direções utilizando as setas nas extremidades externas da carta em foco.
Acesse os codigos Clicando aqui
Um efeito de blur de sobreposição aplicado sobre todos os demais elementos dentro de um container que não estiverem com a sobreposição do mouse ativada.
Acesse os codigos Clicando aqui
Um efeito de revelação com multiplos propositos possiveis utilizando as ferramentas de animação e conceitos como width, height e border-radius.
Acesse os codigos Clicando aqui
Aplicação de uma animação 3D para criar o efeito de frente e verso em uma carta que rotaciona ao sobrepor com o ponteiro do mouse.
Acesse os codigos Clicando aqui
Nesta animação foi criado uma animação de pulso de luz utilizando a ferramenta do CSS dropshadow para que o formato do vetor fosse usado para criar o efeito mais completo.
Acesse os codigos Clicando aqui
Acesse os codigos Clicando aqui
Acesse os codigos Clicando aqui
Acesse os codigos Clicando aqui
Acesse os codigos Clicando aqui
Acesse os codigos Clicando aqui
Neste efeito de sobreposição de botão cria um efeito de reflexão de luz no vidro.
Acesse os codigos Clicando aqui
Esse efeito anima a borda para transitar entre diferentes cores.
Acesse os codigos Clicando aqui
Neste efeito utilizasse o paramentro stroke-width e o stroke-dasharray para criar um efeito no vetor que forma a borda do botão.
Acesse os codigos Clicando aqui
Neste efeito é realizado uma animação de menu estilizada ao trocar entre as opções do menu.
Acesse os codigos Clicando aqui
Neste efeito de perseguição do mouse sem a utilização do recurso canva do html.
Acesse os codigos Clicando aqui
Neste efeito foi utilizado os recursos CSS para criar o efeito de iluminação neon.
Acesse os codigos Clicando aqui
Aqui foi utilizado os recursos do CSS em junção com o javascript para criar uma animação parallax ao descer ou subir a pagina.
Acesse os codigos Clicando aqui
Neste projeto foi utilizado as ferramentas do css para criar um efeito 3D de um caixa girando.
Acesse os codigos Clicando aqui
Esta animação simula um texto em processo de escrita.
Acesse os codigos Clicando aqui
Neste efeito de carregamento foi criado três bolas saltando.
Acesse os codigos Clicando aqui
Neste efeito para imagens foi criado uma animação que simula o glitch de imagens.
Acesse os codigos Clicando aqui
Nesta animação de carregamento foi utilizado a função do CSS 'animation-fill-mode' para mudar o formato sobreposição de imagens e criar um efeito unico.
Acesse os codigos Clicando aqui
Neste efeito foi usado o recurso canva do HTML junto ao javascript para criar uma trilha por onde o mouse passa na tela.
Acesse os codigos Clicando aqui
Nessa animação de texto foi criado o efeito de onda no background dos textos.
Acesse os codigos Clicando aqui
Sinta-se à vontade para explorar, experimentar, e, se desejar, contribuir!
Nota: Alguns projetos podem estar em um estado experimental ou inacabado, então fique à vontade para experimentar e expandir!