{"id":16786165,"url":"https://github.com/ricmaloy/-30diasdecss","last_synced_at":"2025-10-25T19:11:00.419Z","repository":{"id":112688836,"uuid":"283510886","full_name":"Ricmaloy/-30diasDeCSS","owner":"Ricmaloy","description":"30 dias de CSS3 é um desafio que vou aceitar (proposto por @MilenaCarecho), que visa melhorar minhas habilidades em HTML5 e CSS3 através da realização de mini projetos","archived":false,"fork":false,"pushed_at":"2020-08-28T04:14:15.000Z","size":30077,"stargazers_count":14,"open_issues_count":0,"forks_count":2,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-04-10T23:04:17.029Z","etag":null,"topics":["animation-css","css","css3","html","html5"],"latest_commit_sha":null,"homepage":"","language":"CSS","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/Ricmaloy.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2020-07-29T13:46:54.000Z","updated_at":"2024-05-21T03:11:47.000Z","dependencies_parsed_at":null,"dependency_job_id":"d6583c1c-5732-46d5-b9b6-ba95254183df","html_url":"https://github.com/Ricmaloy/-30diasDeCSS","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Ricmaloy%2F-30diasDeCSS","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Ricmaloy%2F-30diasDeCSS/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Ricmaloy%2F-30diasDeCSS/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Ricmaloy%2F-30diasDeCSS/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Ricmaloy","download_url":"https://codeload.github.com/Ricmaloy/-30diasDeCSS/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248312143,"owners_count":21082638,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["animation-css","css","css3","html","html5"],"created_at":"2024-10-13T08:11:22.628Z","updated_at":"2025-10-25T19:11:00.342Z","avatar_url":"https://github.com/Ricmaloy.png","language":"CSS","funding_links":[],"categories":[],"sub_categories":[],"readme":"# 🚀 30diasDeCSS 🚀\n\n  Bom dia/tarde/noite, tudo bom ?  \n  \n  30 dias de CSS3 é um desafio que visa melhorar minhas habilidades em HTML5 e CSS3 através da realização de mini projetos diários.\n  Todos os créditos à [@MilenaCarecho](https://twitter.com/MilenaCarecho) 😄\n\n # Objetivo\n\n  30 dias de CSS3 é um desafio que vou aceitar (e você também pode participar) a partir de 20 de Julho de 2020 (estou começando dia 29), que visa melhorar minhas habilidades em       HTML5 e CSS3 através da realização de projetos \n  \n  # Regras gerais\n\n  * Realizar um projeto por dia\n  * Compartilhe seu progresso nas mídias sociais (Twitter, Facebook, Linkedin etc.) usando a hashtag #30diasDeCSS\n  * O projeto deve ser concluído até 23:59\n\n  # Regras pra mim \n  Vou aderir as regras tambem hihi, mas vou fazer uma alteração, lembrando que não é obrigação, fique à vontade para fazer o mesmo, se quiser!\n\n  * Se eu não concluir o projeto do dia, as 5 primeiras pessoas a apontar no Twitter [@Ricardinho_tremetreme](https://twitter.com/Ricardo_Zamboni) eu vou somar R$5 (total de R$25) numa quantia e ao final dos 30 dias irei doar toda essa quantia a uma instituição(a ser definida ainda).Adicionando um pouco de motivação para mim! 💸\n  \n  Gostou da ideia? \n  [Clique aqui](https://github.com/MilenaCarecho/30diasDeCSS/issues/1) para participar \n  \n#### Youtube Referencias dos desafios\n[Online Tutorials](https://www.youtube.com/channel/UCbwXnUipZsLfUckBPsC7Jog) - \n[Creative Creations](https://www.youtube.com/channel/UCOKmVksbzoKJKmtu7rlEM1A) - \n[DarkCode](https://www.youtube.com/channel/UCD3KVjbb7aq2OiOffuungzw)\n\n#### Achei muito divertido ideia, e desafio todos que tenham interesse 🤗\n#### Novamente, todos os créditos à criadora do desafio 👉 [@MilenaCarecho](https://twitter.com/MilenaCarecho) 👈\n\n## Minhas redes sociais\n * [Facebook](https://www.facebook.com/ricardo.zamboni.142/)\n * [LinkedIn](https://www.linkedin.com/in/ricardo-zamboni-3906471b3/)\n * [GitHub](https://github.com/Ricmaloy)\n * [Twitter](https://twitter.com/Ricardo_Zamboni)\n  \n##### Vou atualizando aqui diariamente, qualquer dúvida estou a disposição \n\n* [Dia 01 - Ícone de mídia social em camadas](#id01)\n* [Dia 02 - Loader animado](#id02)\n* [Dia 03 - Mudança de cor de texto quando entra em outra div](#id03)\n* [Dia 04 - Botão com efeito](#id04)\n* [Dia 05 - Efeito pulsar](#id05)\n* [Dia 06 - Efeito lightning text](#id06)\n* [Dia 07 - Preloader animado](#id07)\n* [Dia 08 - Coração batendo](#id08)\n* [Dia 09 - Pêndulo de Newton](#id09)\n* [Dia 10 - Animação texto alternando](#id10)\n* [Dia 11 - Botão com efeito hover](#id11)\n* [Dia 12 - Efeito de texto de preenchimento ao passar o mouse](#id12)\n* [Dia 13 - Loading com efeito](#id13)\n* [Dia 14 - Fundo de texto animado](#id14)\n* [Dia 15 - Texto flutuante](#id15)\n* [Dia 16 - Botão com efeito](#id16)\n* [Dia 17 - Loader animado](#id17)\n* [Dia 18 - Texto esfumaçado](#id18)\n* [Dia 19 - Efeitos de animação fundo de partículas](#id19)\n* [Dia 20 - Botão com efeito](#id20)\n* [Dia 21 - Esferas quicando](#id21)\n* [Dia 22 - Icones com efeito](#id22)\n* [Dia 23 - Botão com efeito hover](#id23)\n* [Dia 24 - Preloader animado](#id24)\n* [Dia 25 - Checkbox animado](#id25)\n* [Dia 26 - Loading com efeito](#id26)\n* [Dia 27 - Efeito pulsar](#id27)\n* [Dia 28 - Cor do background mudando](#id28)\n* [Dia 29 - Menu responsivo com Media Queries](#id29)\n* [Dia 30 - Fogos de artificio](#id30)\n\n\n##  Desafio dia 01 - Ícone de mídia social em camadas \u003ca name=\"id01\"\u003e\u003c/a\u003e\n![Dia 01](https://i.imgur.com/2jBQn1g.gif)\n\n##### O que eu aprendi\n\n\n* *Criar as camadas utilizando a tag `\u003cspan\u003e`*\n* *[Transições CSS](https://www.w3schools.com/css/css3_transitions.asp)*\n* *[Opacidade / transparência do CSS](https://www.w3schools.com/css/css_image_transparency.asp)*\n* *[hover](https://www.w3schools.com/cssref/sel_hover.asp)*\n* *[nth-child ()](https://www.w3schools.com/cssref/sel_nth-child.asp)*\n\n\n##  Desafio dia 02 - Loader animado \u003ca name=\"id02\"\u003e\u003c/a\u003e\n![Dia 02](https://i.imgur.com/o23iDx4.gif)\n\n##### O que eu aprendi\n\n\n* *sobrepor elementos utilizando posicionamento [absolute](https://www.w3schools.com/cssref/pr_class_position.asp)*\n* *[Animations](https://www.w3schools.com/css/css3_animations.asp)*\n* *[@keyframe usando from to](https://www.w3schools.com/cssref/css3_pr_animation-keyframes.asp)*\n* *[clip-path: polygon()](https://www.w3schools.com/cssref/css3_pr_clip-path.asp)*\n\n\n##  Desafio dia 03 - Mudança de cor de texto quando entra em outra div \u003ca name=\"id03\"\u003e\u003c/a\u003e\n![Dia 03](gifs/giphy.gif)\n\n##### O que eu aprendi\n\n* *[Animations](https://www.w3schools.com/css/css3_animations.asp)*\n* *[HTML video](https://www.w3schools.com/html/html5_video.asp)*\n* *[@keyframe usando from to](https://www.w3schools.com/cssref/css3_pr_animation-keyframes.asp)*\n* *[Overflow](https://www.w3schools.com/css/css_overflow.asp)*\n* *[CSS Text](https://www.w3schools.com/css/css_text.asp)\n\n\n##  Desafio dia 04 - Botão com efeito \u003ca name=\"id04\"\u003e\u003c/a\u003e\n![Dia 04](https://i.imgur.com/yvzI1gN.gif)\n\n##### O que eu aprendi\n\n* *[Animations](https://www.w3schools.com/css/css3_animations.asp)*\n* *[hover](https://www.w3schools.com/cssref/sel_hover.asp)*\n* *[::before](https://www.w3schools.com/cssref/sel_before.asp)*\n* *[::after](https://www.w3schools.com/cssref/sel_after.asp)*\n* *[Transições ](https://www.w3schools.com/css/css3_transitions.asp)*\n* *[Overflow](https://www.w3schools.com/css/css_overflow.asp)*\n\n\n##  Desafio dia 05 - Efeito pulsar \u003ca name=\"id05\"\u003e\u003c/a\u003e\n![Dia 05](https://i.imgur.com/jZIOslJ.gif)\n\n##### O que eu aprendi\n\n* *[Animations](https://www.w3schools.com/css/css3_animations.asp)*\n* *[Opacidade / transparência do CSS](https://www.w3schools.com/css/css_image_transparency.asp)*\n* *[@keyframe](https://www.w3schools.com/cssref/css3_pr_animation-keyframes.asp)*\n* *sobrepor elementos utilizando posicionamento [absolute](https://www.w3schools.com/cssref/pr_class_position.asp)*\n\n\n##  Desafio dia 06 - Efeito lightning text \u003ca name=\"id06\"\u003e\u003c/a\u003e\n![Dia 06](https://i.imgur.com/jglVJFh.gif)\n\n##### O que eu aprendi\n\n* *[Animations](https://www.w3schools.com/css/css3_animations.asp)*\n* *[Opacidade / transparência do CSS](https://www.w3schools.com/css/css_image_transparency.asp)*\n* *[@keyframe](https://www.w3schools.com/cssref/css3_pr_animation-keyframes.asp)*\n* *[nth-child ()](https://www.w3schools.com/cssref/sel_nth-child.asp)*\n\n\n##  Desafio dia 07 - Preloader animado \u003ca name=\"id07\"\u003e\u003c/a\u003e\n![Dia 07](https://i.imgur.com/LGQuSAo.gif)\n\n##### O que eu aprendi\n\n* *[Animations](https://www.w3schools.com/css/css3_animations.asp)*\n* *[@keyframe](https://www.w3schools.com/cssref/css3_pr_animation-keyframes.asp)*\n* *[nth-child ()](https://www.w3schools.com/cssref/sel_nth-child.asp)*\n* *[transform](https://www.w3schools.com/cssref/css3_pr_transform.asp)*\n* *[transform: scale()](https://developer.mozilla.org/pt-BR/docs/Web/CSS/transform-function/scale)*\n\n\n##  Desafio dia 08 - Coração batendo \u003ca name=\"id08\"\u003e\u003c/a\u003e\n![Dia 08](https://i.imgur.com/NidsuBx.gif)\n\n##### O que eu aprendi\n\n* *[Animations](https://www.w3schools.com/css/css3_animations.asp)*\n* *[@keyframe](https://www.w3schools.com/cssref/css3_pr_animation-keyframes.asp)*\n* *[transform](https://www.w3schools.com/cssref/css3_pr_transform.asp)*\n* *[transform: scale()](https://developer.mozilla.org/pt-BR/docs/Web/CSS/transform-function/scale)*\n* *[Font Awesome](https://fontawesome.com/icons)*\n\n\n##  Desafio dia 09 - Pêndulo de Newton \u003ca name=\"id09\"\u003e\u003c/a\u003e\n![Dia 09](https://i.imgur.com/1WKAlOF.gif)\n\n##### O que eu aprendi\n\n* *[Animations](https://www.w3schools.com/css/css3_animations.asp)*\n* *[@keyframe](https://www.w3schools.com/cssref/css3_pr_animation-keyframes.asp)*\n* *[Display: flex](https://www.w3schools.com/css/css3_flexbox.asp)*\n* *[justify-content](https://www.w3schools.com/cssref/css3_pr_justify-content.asp)*\n* *[transform-origin](https://www.w3schools.com/cssref/css3_pr_transform-origin.asp)*\n\n\n##  Desafio dia 10 - Animação texto alternando \u003ca name=\"id10\"\u003e\u003c/a\u003e\n![Dia 10](https://i.imgur.com/EHNJbfz.gif)\n\n##### O que eu aprendi\n\n* *[Animations](https://www.w3schools.com/css/css3_animations.asp)*\n* *[@keyframe](https://www.w3schools.com/cssref/css3_pr_animation-keyframes.asp)*\n* *[::after](https://www.w3schools.com/cssref/sel_after.asp)*\n\n\n##  Desafio dia 11 - Botão com efeito hover \u003ca name=\"id11\"\u003e\u003c/a\u003e\n![Dia 11](https://i.imgur.com/m0Wijoo.gif)\n\n##### O que eu aprendi\n\n* *[cubic-bezier](https://www.w3schools.com/cssref/func_cubic-bezier.asp)*\n* *[hover](https://www.w3schools.com/cssref/sel_hover.asp)*\n* *[::before](https://www.w3schools.com/cssref/sel_before.asp)*\n\n\n##  Desafio dia 12 - Efeito de texto de preenchimento ao passar o mouse \u003ca name=\"id12\"\u003e\u003c/a\u003e\n![Dia 12](https://i.imgur.com/KWpbXfQ.gif)\n\n##### O que eu aprendi\n\n* *[background-clip](https://www.w3schools.com/cssref/css3_pr_background-clip.asp)*\n* *[hover](https://www.w3schools.com/cssref/sel_hover.asp)*\n* *[::before](https://www.w3schools.com/cssref/sel_before.asp)*\n\n\n##  Desafio dia 13 - Loading com efeito \u003ca name=\"id13\"\u003e\u003c/a\u003e\n![Dia 13](https://i.imgur.com/iSleaFD.gif)\n\n##### O que eu aprendi\n\n* *[Animations](https://www.w3schools.com/css/css3_animations.asp)*\n* *[@keyframe](https://www.w3schools.com/cssref/css3_pr_animation-keyframes.asp)*\n* *[nth-child ()](https://www.w3schools.com/cssref/sel_nth-child.asp)*\n\n\n##  Desafio dia 14 - Fundo de texto animado \u003ca name=\"id14\"\u003e\u003c/a\u003e\n![Dia 14](https://i.imgur.com/yUHnbAz.gif)\n\n##### O que eu aprendi\n\n* *[Animations](https://www.w3schools.com/css/css3_animations.asp)*\n* *[@keyframe](https://www.w3schools.com/cssref/css3_pr_animation-keyframes.asp)*\n* *[background-clip](https://www.w3schools.com/cssref/css3_pr_background-clip.asp)*\n* *[text-stroke](https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-text-stroke)*\n\n\n##  Desafio dia 15 - Texto flutuante \u003ca name=\"id15\"\u003e\u003c/a\u003e\n![Dia 15](https://i.imgur.com/uPJroSj.gif)\n\n##### O que eu aprendi\n\n* *[Animations](https://www.w3schools.com/css/css3_animations.asp)*\n* *[@keyframe](https://www.w3schools.com/cssref/css3_pr_animation-keyframes.asp)*\n* *[rotate()](https://www.w3schools.com/cssref/css3_pr_transform.asp)*\n* *[text-shadow](https://www.w3schools.com/cssref/css3_pr_text-shadow.asp)*\n\n\n##  Desafio dia 16 - Botão com efeito \u003ca name=\"id16\"\u003e\u003c/a\u003e\n![Dia 16](https://i.imgur.com/sdqhGmE.gif)\n\n##### O que eu aprendi\n\n* *[Animations](https://www.w3schools.com/css/css3_animations.asp)*\n* *[@keyframe](https://www.w3schools.com/cssref/css3_pr_animation-keyframes.asp)*\n* *[box-shadow](https://www.w3schools.com/cssref/css3_pr_box-shadow.asp)*\n\n\n##  Desafio dia 17 - Loader animado \u003ca name=\"id17\"\u003e\u003c/a\u003e\n![Dia 17](gifs/starWars.gif)\n\n##### O que eu aprendi\n\n* *[Animations](https://www.w3schools.com/css/css3_animations.asp)*\n* *[rotate()](https://www.w3schools.com/cssref/css3_pr_transform.asp)*\n* *[@font-face](https://www.w3schools.com/cssref/css3_pr_font-face_rule.asp)*\n* *[@keyframe usando from to](https://www.w3schools.com/cssref/css3_pr_animation-keyframes.asp)*\n\n\n##  Desafio dia 18 - Texto esfumaçado \u003ca name=\"id18\"\u003e\u003c/a\u003e\n![Dia 18](https://i.imgur.com/S5ExhDx.gif)\n\n##### O que eu aprendi\n\n* *[Animations](https://www.w3schools.com/css/css3_animations.asp)*\n* *[blur()](https://www.w3schools.com/cssref/css3_pr_filter.asp)*\n\n\n##  Desafio dia 19 - Efeitos de animação fundo de partículas \u003ca name=\"id19\"\u003e\u003c/a\u003e\n![Dia 19](https://i.imgur.com/T0S4cb0.gif)\n\n##### O que eu aprendi\n\n* *[Animations](https://www.w3schools.com/css/css3_animations.asp)*\n* *[@keyframe](https://www.w3schools.com/cssref/css3_pr_animation-keyframes.asp)*\n* *[rotate()](https://www.w3schools.com/cssref/css3_pr_transform.asp)*\n* *[nth-child ()](https://www.w3schools.com/cssref/sel_nth-child.asp)*\n\n\n##  Desafio dia 20 - Botão com efeito \u003ca name=\"id20\"\u003e\u003c/a\u003e\n![Dia 20](https://i.imgur.com/5v0CUs0.gif)\n\n##### O que eu aprendi\n\n* *[box-shadow](https://www.w3schools.com/cssref/css3_pr_box-shadow.asp)*\n* *[hover](https://www.w3schools.com/cssref/sel_hover.asp)*\n* *[::before](https://www.w3schools.com/cssref/sel_before.asp)*\n* *[Opacidade / transparência do CSS](https://www.w3schools.com/css/css_image_transparency.asp)*\n\n\n##  Desafio dia 21 - Esferas quicando \u003ca name=\"id21\"\u003e\u003c/a\u003e\n![Dia 21](https://i.imgur.com/wlpcO34.gif)\n\n##### O que eu aprendi\n\n* *[Animations](https://www.w3schools.com/css/css3_animations.asp)*\n* *[@keyframe](https://www.w3schools.com/cssref/css3_pr_animation-keyframes.asp)*\n* *[::after](https://www.w3schools.com/cssref/sel_after.asp)*\n* *[::before](https://www.w3schools.com/cssref/sel_before.asp)*\n\n\n##  Desafio dia 22 - Icones com efeito \u003ca name=\"id22\"\u003e\u003c/a\u003e\n![Dia 22](https://i.imgur.com/iW2Zmo9.gif)\n\n##### O que eu aprendi\n\n* *[hover](https://www.w3schools.com/cssref/sel_hover.asp)*\n* *[nth-child ()](https://www.w3schools.com/cssref/sel_nth-child.asp)*\n* *[::after](https://www.w3schools.com/cssref/sel_after.asp)*\n\n\n##  Desafio dia 23 - Icones com efeito \u003ca name=\"id23\"\u003e\u003c/a\u003e\n![Dia 23](https://i.imgur.com/GcMuxAm.gif)\n\n##### O que eu aprendi\n\n* *[hover](https://www.w3schools.com/cssref/sel_hover.asp)*\n* *[::before](https://www.w3schools.com/cssref/sel_before.asp)*\n\n\n##  Desafio dia 24 - Preloader animado \u003ca name=\"id24\"\u003e\u003c/a\u003e\n![Dia 24](https://i.imgur.com/h3ISsRQ.gif)\n\n##### O que eu aprendi\n\n* *[nth-child ()](https://www.w3schools.com/cssref/sel_nth-child.asp)*\n* *[Animations](https://www.w3schools.com/css/css3_animations.asp)*\n* *[@keyframe](https://www.w3schools.com/cssref/css3_pr_animation-keyframes.asp)*\n\n\n##  Desafio dia 25 - Checkbox animado \u003ca name=\"id25\"\u003e\u003c/a\u003e\n![Dia 25](https://i.imgur.com/qfy87GD.gif)\n\n##### O que eu aprendi\n\n* *[hover](https://www.w3schools.com/cssref/sel_hover.asp)*\n* *[Animations](https://www.w3schools.com/css/css3_animations.asp)*\n* *[@keyframe](https://www.w3schools.com/cssref/css3_pr_animation-keyframes.asp)*\n* *[label](https://www.w3schools.com/tags/tag_label.asp)*\n\n\n##  Desafio dia 26 - Loading com efeito \u003ca name=\"id26\"\u003e\u003c/a\u003e\n![Dia 26](https://i.imgur.com/ZgtkUja.gif)\n\n##### O que eu aprendi\n\n* *[nth-child ()](https://www.w3schools.com/cssref/sel_nth-child.asp)*\n* *[Animations](https://www.w3schools.com/css/css3_animations.asp)*\n* *[@keyframe](https://www.w3schools.com/cssref/css3_pr_animation-keyframes.asp)*\n\n\n##  Desafio dia 27 - Efeito pulsar \u003ca name=\"id27\"\u003e\u003c/a\u003e\n![Dia 27](https://i.imgur.com/H0dOTiy.gif)\n\n##### O que eu aprendi\n\n* *[Opacidade / transparência do CSS](https://www.w3schools.com/css/css_image_transparency.asp)*\n* *[Animations](https://www.w3schools.com/css/css3_animations.asp)*\n* *[@keyframe](https://www.w3schools.com/cssref/css3_pr_animation-keyframes.asp)*\n\n\n##  Desafio dia 28 - Cor do background mudando \u003ca name=\"id28\"\u003e\u003c/a\u003e\n![Dia 28](gifs/backgroundColor.gif)\n\n##### O que eu aprendi\n* *[linear-gradient()](https://www.w3schools.com/css/css3_gradients.asp)*\n* *[background-position](https://www.w3schools.com/cssref/pr_background-position.asp)*\n* *[Animations](https://www.w3schools.com/css/css3_animations.asp)*\n* *[@keyframe](https://www.w3schools.com/cssref/css3_pr_animation-keyframes.asp)*\n\n\n##  Desafio dia 29 - Menu responsivo com Media Queries \u003ca name=\"id29\"\u003e\u003c/a\u003e\n![Dia 29](https://i.imgur.com/XJadeEv.gif)\n\n##### O que eu aprendi\n* *[linear-gradient()](https://www.w3schools.com/css/css3_gradients.asp)*\n* *[background-position](https://www.w3schools.com/cssref/pr_background-position.asp)*\n* *[media querie](https://www.w3schools.com/cssref/css3_pr_mediaquery.asp)*\n* *[hover](https://www.w3schools.com/cssref/sel_hover.asp)*\n* *[cubic-bezier](https://www.w3schools.com/cssref/func_cubic-bezier.asp)*\n\n\n##  Desafio dia 30 - Fogos de artificio \u003ca name=\"id30\"\u003e\u003c/a\u003e\n![Dia 30](https://i.imgur.com/rUMPrmQ.gif)\n\n##### O que eu aprendi\n* *[Animations](https://www.w3schools.com/css/css3_animations.asp)*\n* *[@keyframe](https://www.w3schools.com/cssref/css3_pr_animation-keyframes.asp)*\n* *[::before](https://www.w3schools.com/cssref/sel_before.asp)*\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fricmaloy%2F-30diasdecss","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fricmaloy%2F-30diasdecss","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fricmaloy%2F-30diasdecss/lists"}