Created
January 2, 2022 13:46
-
-
Save amitmerchant1990/4554c6e5f4e39ed5e76657683bc2ba73 to your computer and use it in GitHub Desktop.
Snowfall animation on amitmerchant.com
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
.site-avatar { | |
/* Christmas snow 🌨 */ | |
&::before { | |
content: ""; | |
position: absolute; | |
top: 0; | |
left: 0; | |
width: 100%; | |
height: 100%; | |
border-radius: 50%; | |
transform: rotate( | |
-15deg); | |
background-image: radial-gradient(circle at 30% 30%, #fff 1.5%, transparent 2.5%), radial-gradient(circle at 80% 70%, #fff 1.5%, transparent 2.5%), radial-gradient(circle at 30% 50%, #fff 1%, transparent 2%), radial-gradient(circle at 70% 85%, #fff 1%, transparent 2%); | |
background-size: 100% 100%, 100% 100%, 50% 100%, 50% 50%; | |
-webkit-animation: snow 8s linear infinite forwards; | |
animation: snow 8s linear infinite forwards; | |
@keyframes snow { | |
100% { | |
background-position: 0px 200px, 0 200px, 0px 200px, 0px 200px; | |
} | |
} | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment