MilenaCarecho /
30diasDeCSS
Desafio criar 30 mini projetos utilizando HTML e CSS em 30 dias
Recently updatedActive repository
CSSMIT#css#css3#css3-animations#css3-flexbox
⑂ 300 forks◯ 14 issuesUpdated 4 days ago
Loading repository data…
Willian17 / repository
30DiasCss
Desafio de 30 dias seguidos com mini-projetos usando HTML + CSS.
Live repository statistics
★ 10Stars
⑂ 2Forks
◯ 0Open issues
◉ 10Watchers
README preview
:pushpin: Sobre o Projeto
Se você chegou agora e quer começar o desafio, fique a vontade, o desafio não tem data de inicio fixa, cada um faz os seus 30 dias, eu ficarei honrado com sua participação 😉
Regras gerais
- Realizar um projeto por dia
- Compartilhe seu progresso nas mídias sociais (Twitter, Facebook, Linkedin etc.) usando a hashtag #30diasDeCSS
- O projeto deve ser concluído até 23:59
Referencias do projeto
Online Tutorials - Creative Creations - DarkCode MilenaCarecho IamThiago-IT
- Dia 01 - Ícone de mídia social em camadas
- Dia 02 - Botão animado Neon
- Dia 03 - Olhos que segue o mouse
- Dia 04 - Efeito pulsar
- Dia 05 - Efeito lightning text
- Dia 06 - Máquina de Escrever
- Dia 07 - Coração batendo
- Dia 08 - Botão com efeito Hover
- Dia 09 - Cartão de crédito 3D
- Dia 10 - Copo de Café
- Dia 11 - Pendulo de Newton
- Dia 12 - Efeito de preenchimento
- Dia 13 - Todo List Animado
- Dia 14 - Shadow Gradient
- Dia 15 - Texto Saltando
- Dia 16 - Efeito Escalar
- Dia 17 - Cards 3D
- Dia 18 - Texto esfumaçado
- Dia 19 - Fundo de particulas
- Dia 20 - Botão com efeito
- Dia 21 - Esferas quicando
- Dia 22 - Icones com efeito
- Dia 23 - Boneco do Among Us
- Dia 24 - Carousel 3D
- Dia 25 - Checkbox Animado
- Dia 26 - Loading com efeito
- Dia 27 - Efeito pulsar
:arrow_down_small: Desafios
Dia 01 - Ícone de mídia social em camadas
O que eu aprendi
- Criar as camadas utilizando a tag
<span> - tranformação 2D ou 3D de um elemento aqui
- Transições CSS
- Opacidade / transparência do CSS
- hover
- nth-child ()
Dia 02 - Botão animado Neon
O que eu aprendi
- Criar as camadas utilizando a tag
<span> - hover
- nth-child ()
- Criar KeyFrames (animando um elemento)
- Animation
- Linear Gradient
- Box Shadow
Dia 03 - Olhos que segue o mouse
O que eu aprendi
- hover
- Transições CSS
- Before
- Border Radius
- Translate https://github.com/Willian17/30DiasCss/tree/master/Dia%2004
Desafio dia 04 - Efeito pulsar
O que eu aprendi
Desafio dia 05 - Efeito lightning text
O que eu aprendi
Desafio dia 06 - Máquina de Escrever
O que eu aprendi
Desafio dia 07 - Coração batendo
O que eu aprendi
Desafio dia 08 - Botão com efeito hover
O que eu aprendi
Desafio dia 09 - Cartão de crédito 3D
O que eu aprendi
- rotateY
- backdrop-filter
- transform-style
- perspective
Desafio dia 10 - Copo de café
O que eu aprendi
- rotate
- translate
- filter
- animation
Desafio dia 11 - Pendulo de Newton
O que eu aprendi
Desafio dia 12 - Efeito de preenchimento
O que eu aprendi
Desafio dia 13 - Todo List Animado
O que eu aprendi
Desafio dia 14 - Shadow Gradient
[Meu codigo](https://github.com/Willian17/30DiasCss/tree/master/des
ALGORITHMICALLY RELATED
Similar Open-Source Projects
Selected from shared topics, language and repository description—not editorial ratings.
★ 2.9K
SpruceGabriela /
30diasDeCSS
30 dias de CSS3 é um desafio que visa ajudá-lo a melhorar suas habilidades de codificação fazendo mini projetos diarios utilizando HTML5 e CSS3
Active repositoryHas homepage
CSSNo license
⑂ 12 forks◯ 0 issuesUpdated Apr 30, 2026
Project homepage ↗leandrorangel94 /
30diasDeCSS
Desafio 30 dias de CSS, realizado com intuito de praticar com projetos pequenos.
Active repository
CSS