<h2 id="introdução"><a href="#introdu%C3%A7%C3%A3o" class="anchor">Introdução</a></h2>
<p>Fala pessoal, continuando com os <a href="https://willianjusten.com.br/series/#dicas-de-css">vídeos de dicas de CSS</a>, hoje vai mais um vídeo bem simples, mas de uma técnica super famosa e utilizada em diversos sites.</p>
<p>Você pode ver a demo de hoje <a href="https://labs.willianjusten.com.br/reveal-effect/">nest link</a> e o <a href="https://github.com/willianjusten/labs/blob/gh-pages/reveal-effect/index.html">código está lá no Github</a></p>
<h2 id="video"><a href="#video" class="anchor">Video</a></h2>
<iframe width="560" height="315" src="https://www.youtube.com/embed/roy7z45lCes" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
<h2 id="conclusão"><a href="#conclus%C3%A3o" class="anchor">Conclusão</a></h2>
<p>Novamente foi um post/vídeo bastante simples, mas que espero que seja útil para vocês irem aprendendo pequenos detalhes. Peço novamente que se puderem, compartilhem com seus amigos e não deixem de se <a href="https://www.youtube.com/WillianJustenCursos?sub_confirmation=1">inscrever no canal do YouTube</a>, eu estou começando ainda, então é muito importante que vocês me ajudem nesse início!</p>


Como fazer um efeito de mostrar um bloco e então revelar o conteúdo por trás com CSS.

Criando uma animação de Reveal Block com CSS


## Introdução

Fala pessoal, continuando com os vídeos de dicas de CSS, hoje vai mais um vídeo bem simples, mas de uma técnica super famosa e utilizada em diversos sites.

Você pode ver a demo de hoje [nest link](https://labs.willianjusten.com.br/gradient-animation/) e o [código está lá no Github](https://github.com/willianjusten/labs/blob/gh-pages/gradient-animation/index.html)

## Video

<iframe width="560" height="315" src="https://www.youtube.com/embed/6zjdx_HO2-g" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

## Conclusão

Novamente foi um post/vídeo bastante simples, mas que espero que seja útil para vocês irem aprendendo pequenos detalhes. Peço novamente que se puderem, compartilhem com seus amigos e não deixem de se [inscrever no canal do YouTube](https://www.youtube.com/WillianJustenCursos?sub_confirmation=1), eu estou começando ainda, então é muito importante que vocês me ajudem nesse início!


Aprenda a criar um background animado para os seus sites e acaba com a monotonia dos fundos estáticos.

Criando um background com gradiente animado com CSS Puro


## Introdução

Fala pessoal, hoje vou começar uma série de vídeos curtos ~~ou nem tanto~~, onde vou ensinar pequenas dicas de animações ou efeitos legais com CSS.

Já tenho alguns outros vídeos que o pessoal gostou bastante como:

- [Como criar um spinner loader com CSS puro e uma div](https://willianjusten.com.br/como-criar-um-spinner-loader-com-css-puro-e-uma-div/)
- [Criando um ícone menu hamburguer com CSS puro](https://willianjusten.com.br/criando-icone-menu-hamburguer-animado-com-css-puro/)
- [Criando um menu fullscreen animado com CSS puro](https://willianjusten.com.br/criando-menu-fullscreen-animado-com-css-puro/)

E por isso, eu acho que vai ser legal gravar mais coisinhas como essas. Aceito sugestões de coisas que vocês gostariam que eu ensinasse também =D

Você pode ver a demo de hoje [nest link](https://labs.willianjusten.com.br/typing-effect-css/) e o [código está lá no Github](https://github.com/willianjusten/labs/blob/gh-pages/typing-effect-css/index.html)

## Video

<iframe width="560" height="315" src="https://www.youtube.com/embed/hFsscx2U5bw" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

## Conclusão

Espero que vocês gostem da animação e do modelo de post/vídeo, por favor, não deixem de comentar, compartilhar e se inscrever no meu canal no YouTube, quanto mais gente assistir, mais coisas eu vou fazer.


Como fazer um efeito parecido com uma máquina de escrever digitando na tela somente só CSS.

Willian JustenSoftware Engineer

Introdução

Video

Conclusão