Despite server side validation, there is no guarantee that all code is safe to run. No user submitted code is ran automatically, if you wish to run code click the "demo" button to run its corresponding code to the right. I tend to manually review a script a day or two after its posted and will obviously remove anything sus
Yarshmellow
demo
clone
id: 3562031459
Hiii this is really cool
source: (triple click to highlight all)
<section id="snowflakes3562031459"><!--snowflakes(v1) generated with: https://snowfallgarden.lophius.xyz--><style>#snowflakes3562031459 { overflow:hidden; pointer-events:none; image-rendering:pixelated; } #snowflakes3562031459 > span { position:fixed; top:-35px; height:calc(100vh + 35px); } #snowflakes3562031459 span div { width:35px; height:35px; position:relative; background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACMAAAAjCAYAAAAe2bNZAAAAAXNSR0IArs4c6QAAAttJREFUWEfNmE+IjVEYxn+PfyFjaJSFUrNCGv8Sk0JZIJlZs5jVLJgoCzYsLCzYsFCEhZUFayMxCzWjhOTfJGOl1CyUiUGI4fW9Ovd27nfPnWsy437v7txzzvs973ve5znvuaJApgJhofhgzKwZuABslbQklT0zuwp0SRorzZvZDOCKpL019gwD/UCPpNH8mqrMmNksYBVwGNif2uROzOwysAmYCywF3gBfgHuSumuA8SAvAmeA55K+x+tSYJa7Q2CPpD4zW5hzPCbpU5SNLSFaz+JA9HsT4Jkqm6T3ZrYduOaBSBqaKJjbOTBDmdNDfwHmbPZRDywGs+NfwQx67UQ+3wIfw3hxOCqvA1/jGfV5t/lZ3fl8yfoltU0ITByJmY1Iagk10go0S3oaxl7g+yRNi7L0C7gkqSesWQOMSnodxmV/qZoal9o5MNeBDknlPWb2Q9LMCEx+bECvpM7JBrMhFOp5SUeC892AR30KOAq0SroR5k4DB4I8PJwUMMCrjFVOYaez09iZ9BXolHTHzCrYZGbbAM/inIzCTZKc7r7X62lZ6djrHpOZDedFzsxcxLqio1gJuMY4UxYlCvhdJgtO2W5JL6J9FX4CwIrvVdRMCkwqguCoD9iVAHNTkmtJXct/rwoMcCuloGZ2Ajgp6VsAsw54AmwuiR5wF1ibFezjsGY2cEzS8TyyoOA745PIg3HFHJS0IrF5OuDUXJCjf1KBA5gPQIuknwl/L4G2+G5LXQcuYLHNywrSs+D0PAh4lPfD3fUo6MgzM1vtOgSsD3dPO+DZPBcK2rP1OXYsKRbT+i2Emblw+XE4e3rNbGMAU/I74E7NzIPwLJWsXdIDM+sIYPz4/ghmLStuZkI/UoyacaoViU1VotdQnSmMAie0YKRhd1MKTNTPNP7WjsAUqp/5/52emeVfB43rgRNgCvU6aOi7qTgvytCHFOOtXbdXnMIFxf9LZAqDH9f1b8f3gEKbaacJAAAAAElFTkSuQmCC); animation: sine 15s linear 0s infinite normal;} @keyframes sine { 0%{left:-110px; top:0%;} 1%{left:-101px; top:1%;} 2%{left:-91px; top:2%;} 3%{left:-81px; top:3%;} 4%{left:-72px; top:4%;} 5%{left:-63px; top:5%;} 6%{left:-54px; top:6%;} 7%{left:-46px; top:7%;} 8%{left:-39px; top:8%;} 9%{left:-32px; top:9%;} 10%{left:-26px; top:10%;} 11%{left:-21px; top:11%;} 12%{left:-17px; top:12%;} 13%{left:-14px; top:13%;} 14%{left:-12px; top:14%;} 15%{left:-11px; top:15%;} 16%{left:-11px; top:16%;} 17%{left:-11px; top:17%;} 18%{left:-13px; top:18%;} 19%{left:-16px; top:19%;} 20%{left:-20px; top:20%;} 21%{left:-24px; top:21%;} 22%{left:-30px; top:22%;} 23%{left:-36px; top:23%;} 24%{left:-43px; top:24%;} 25%{left:-51px; top:25%;} 26%{left:-59px; top:26%;} 27%{left:-68px; top:27%;} 28%{left:-77px; top:28%;} 29%{left:-87px; top:29%;} 30%{left:-96px; top:30%;} 31%{left:-106px; top:31%;} 32%{left:-116px; top:32%;} 33%{left:-126px; top:33%;} 34%{left:-136px; top:34%;} 35%{left:-146px; top:35%;} 36%{left:-155px; top:36%;} 37%{left:-163px; top:37%;} 38%{left:-172px; top:38%;} 39%{left:-179px; top:39%;} 40%{left:-186px; top:40%;} 41%{left:-192px; top:41%;} 42%{left:-198px; top:42%;} 43%{left:-202px; top:43%;} 44%{left:-206px; top:44%;} 45%{left:-208px; top:45%;} 46%{left:-210px; top:46%;} 47%{left:-210px; top:47%;} 48%{left:-210px; top:48%;} 49%{left:-209px; top:49%;} 50%{left:-206px; top:50%;} 51%{left:-203px; top:51%;} 52%{left:-199px; top:52%;} 53%{left:-194px; top:53%;} 54%{left:-188px; top:54%;} 55%{left:-181px; top:55%;} 56%{left:-174px; top:56%;} 57%{left:-166px; top:57%;} 58%{left:-157px; top:58%;} 59%{left:-148px; top:59%;} 60%{left:-138px; top:60%;} 61%{left:-129px; top:61%;} 62%{left:-119px; top:62%;} 63%{left:-109px; top:63%;} 64%{left:-99px; top:64%;} 65%{left:-89px; top:65%;} 66%{left:-79px; top:66%;} 67%{left:-70px; top:67%;} 68%{left:-61px; top:68%;} 69%{left:-53px; top:69%;} 70%{left:-45px; top:70%;} 71%{left:-38px; top:71%;} 72%{left:-31px; top:72%;} 73%{left:-25px; top:73%;} 74%{left:-21px; top:74%;} 75%{left:-17px; top:75%;} 76%{left:-14px; top:76%;} 77%{left:-12px; top:77%;} 78%{left:-11px; top:78%;} 79%{left:-11px; top:79%;} 80%{left:-12px; top:80%;} 81%{left:-14px; top:81%;} 82%{left:-16px; top:82%;} 83%{left:-20px; top:83%;} 84%{left:-25px; top:84%;} 85%{left:-31px; top:85%;} 86%{left:-37px; top:86%;} 87%{left:-44px; top:87%;} 88%{left:-52px; top:88%;} 89%{left:-60px; top:89%;} 90%{left:-69px; top:90%;} 91%{left:-79px; top:91%;} 92%{left:-88px; top:92%;} 93%{left:-98px; top:93%;} 94%{left:-108px; top:94%;} 95%{left:-118px; top:95%;} 96%{left:-128px; top:96%;} 97%{left:-138px; top:97%;} 98%{left:-147px; top:98%;} 99%{left:-156px; top:99%;} 100%{left:-165px; top:100%;} }</style><span style="left:110vw;"><div style="animation-delay:4.4s;"></div></span><span style="left:100vw;"><div style="animation-delay:16.6s;"></div></span><span style="left:90vw;"><div style="animation-delay:17.7s;"></div></span><span style="left:80vw;"><div style="animation-delay:15.2s;"></div></span><span style="left:70vw;"><div style="animation-delay:11.9s;"></div></span><span style="left:60vw;"><div style="animation-delay:0.3s;"></div></span><span style="left:50vw;"><div style="animation-delay:4.7s;"></div></span><span style="left:40vw;"><div style="animation-delay:16.5s;"></div></span><span style="left:30vw;"><div style="animation-delay:5.5s;"></div></span><span style="left:20vw;"><div style="animation-delay:11.6s;"></div></span><span style="left:10vw;"><div style="animation-delay:17.5s;"></div></span><span style="left:0vw;"><div style="animation-delay:2.2s;"></div></span><span style="left:-10vw;"><div style="animation-delay:3.1s;"></div></span></section>
fyu7i8
demo
clone
id: 68373453
rrrrrrrrrrrrr
source: (triple click to highlight all)
<section id="snowflakes68373453"><!--snowflakes(v1) generated with: https://snowfallgarden.lophius.xyz--><style>#snowflakes68373453 { overflow:hidden; pointer-events:none; image-rendering:pixelated; } #snowflakes68373453 > span { position:fixed; top:-15px; height:calc(100vh + 15px); } #snowflakes68373453 span div { width:30px; height:15px; position:relative; background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAPCAYAAADzun+cAAAAAXNSR0IArs4c6QAAAKJJREFUSEvNVUEOgDAIg/8/egYTTNdQ1ESdnrbBKKUM3cxsjDHc3WPNX9jyLHxwj75s6+KFbQdTwAlSBb1qq4hMwOHAWXJCuEfgKvmKDN45yqtAFLNKFqxMrpEMYky6sn5VBVDvZMpnue/itQ1VZV0xVTqyHFMzqkCdvk/ckYyVNlzGOw35b8b5vLrhclbyyxov6eol71iV5PXJtXRWf/132gCPIEQfPkiejgAAAABJRU5ErkJggg==); animation: sine 15s linear 0s infinite normal;} @keyframes sine { 0%{left:-110px; top:0%;} 1%{left:-101px; top:1%;} 2%{left:-91px; top:2%;} 3%{left:-81px; top:3%;} 4%{left:-72px; top:4%;} 5%{left:-63px; top:5%;} 6%{left:-54px; top:6%;} 7%{left:-46px; top:7%;} 8%{left:-39px; top:8%;} 9%{left:-32px; top:9%;} 10%{left:-26px; top:10%;} 11%{left:-21px; top:11%;} 12%{left:-17px; top:12%;} 13%{left:-14px; top:13%;} 14%{left:-12px; top:14%;} 15%{left:-11px; top:15%;} 16%{left:-11px; top:16%;} 17%{left:-11px; top:17%;} 18%{left:-13px; top:18%;} 19%{left:-16px; top:19%;} 20%{left:-20px; top:20%;} 21%{left:-24px; top:21%;} 22%{left:-30px; top:22%;} 23%{left:-36px; top:23%;} 24%{left:-43px; top:24%;} 25%{left:-51px; top:25%;} 26%{left:-59px; top:26%;} 27%{left:-68px; top:27%;} 28%{left:-77px; top:28%;} 29%{left:-87px; top:29%;} 30%{left:-96px; top:30%;} 31%{left:-106px; top:31%;} 32%{left:-116px; top:32%;} 33%{left:-126px; top:33%;} 34%{left:-136px; top:34%;} 35%{left:-146px; top:35%;} 36%{left:-155px; top:36%;} 37%{left:-163px; top:37%;} 38%{left:-172px; top:38%;} 39%{left:-179px; top:39%;} 40%{left:-186px; top:40%;} 41%{left:-192px; top:41%;} 42%{left:-198px; top:42%;} 43%{left:-202px; top:43%;} 44%{left:-206px; top:44%;} 45%{left:-208px; top:45%;} 46%{left:-210px; top:46%;} 47%{left:-210px; top:47%;} 48%{left:-210px; top:48%;} 49%{left:-209px; top:49%;} 50%{left:-206px; top:50%;} 51%{left:-203px; top:51%;} 52%{left:-199px; top:52%;} 53%{left:-194px; top:53%;} 54%{left:-188px; top:54%;} 55%{left:-181px; top:55%;} 56%{left:-174px; top:56%;} 57%{left:-166px; top:57%;} 58%{left:-157px; top:58%;} 59%{left:-148px; top:59%;} 60%{left:-138px; top:60%;} 61%{left:-129px; top:61%;} 62%{left:-119px; top:62%;} 63%{left:-109px; top:63%;} 64%{left:-99px; top:64%;} 65%{left:-89px; top:65%;} 66%{left:-79px; top:66%;} 67%{left:-70px; top:67%;} 68%{left:-61px; top:68%;} 69%{left:-53px; top:69%;} 70%{left:-45px; top:70%;} 71%{left:-38px; top:71%;} 72%{left:-31px; top:72%;} 73%{left:-25px; top:73%;} 74%{left:-21px; top:74%;} 75%{left:-17px; top:75%;} 76%{left:-14px; top:76%;} 77%{left:-12px; top:77%;} 78%{left:-11px; top:78%;} 79%{left:-11px; top:79%;} 80%{left:-12px; top:80%;} 81%{left:-14px; top:81%;} 82%{left:-16px; top:82%;} 83%{left:-20px; top:83%;} 84%{left:-25px; top:84%;} 85%{left:-31px; top:85%;} 86%{left:-37px; top:86%;} 87%{left:-44px; top:87%;} 88%{left:-52px; top:88%;} 89%{left:-60px; top:89%;} 90%{left:-69px; top:90%;} 91%{left:-79px; top:91%;} 92%{left:-88px; top:92%;} 93%{left:-98px; top:93%;} 94%{left:-108px; top:94%;} 95%{left:-118px; top:95%;} 96%{left:-128px; top:96%;} 97%{left:-138px; top:97%;} 98%{left:-147px; top:98%;} 99%{left:-156px; top:99%;} 100%{left:-165px; top:100%;} }</style><span style="left:110vw;"><div style="animation-delay:2.9s;"></div></span><span style="left:100vw;"><div style="animation-delay:19.2s;"></div></span><span style="left:90vw;"><div style="animation-delay:10.2s;"></div></span><span style="left:80vw;"><div style="animation-delay:18s;"></div></span><span style="left:70vw;"><div style="animation-delay:13.5s;"></div></span><span style="left:60vw;"><div style="animation-delay:5.3s;"></div></span><span style="left:50vw;"><div style="animation-delay:19.5s;"></div></span><span style="left:40vw;"><div style="animation-delay:15.6s;"></div></span><span style="left:30vw;"><div style="animation-delay:4.3s;"></div></span><span style="left:20vw;"><div style="animation-delay:2.7s;"></div></span><span style="left:10vw;"><div style="animation-delay:16.7s;"></div></span><span style="left:0vw;"><div style="animation-delay:10.6s;"></div></span><span style="left:-10vw;"><div style="animation-delay:10.6s;"></div></span></section>
OWEN
demo
clone
id: 2939762373
hi!! just found this website now, thought id leave a flake :*)
source: (triple click to highlight all)
<section id="snowflakes2939762373"><!--snowflakes(v1) generated with: https://snowfallgarden.lophius.xyz--><style>#snowflakes2939762373 { overflow:hidden; pointer-events:none; image-rendering:pixelated; } #snowflakes2939762373 > span { position:fixed; top:-35px; height:calc(100vh + 35px); } #snowflakes2939762373 span div { width:35px; height:35px; position:relative; background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACMAAAAjCAYAAAAe2bNZAAABaElEQVRYR9VX0RKDMAjT///oTb3DwyyQ9KV2vm2lECEE3LeFnn0hLFsL5nM8Gex+PAg+26jz8y6zCZ8lmAgSl8/f6CjboH0EyPcqGwtMDq4csXKzO+ylhsGcFzpHFRiWzapUdpkCjKp7Lg/aquy2hLzTl4jLOMBIjlnEZmAvRcEwrsTlCFLxobJjWcJySTAs7V26nQ6r+GeDqThT6YziB2sGizOsU1B/FJc6H7K1K6U9QTBl7v7rVPdBfnc2MUVWratKhbGtQTmipFVLO9m5wHRzRWmNo7zdMM2xH2By2hVA1CJnjlWljrh3mRh61n6dsnYAUVtYvPUyo0riSHnmjps95Ot63eRozTI6g+mcpsBs73htNrF2drY3NRrYrPvvfQbFafqm9zNN39qBHX44E1jtyLQpKo1x5pLSp1Ef7XeTM4k7QCN70NWNXWZwpXjtWzurLluwkFuoM+y8srn9q7rPPLem9ixAX4GVbELtAbgjAAAAAElFTkSuQmCC); animation: sine 15s linear 0s infinite normal;} @keyframes sine { 0%{left:-110px; top:0%;} 1%{left:-101px; top:1%;} 2%{left:-91px; top:2%;} 3%{left:-81px; top:3%;} 4%{left:-72px; top:4%;} 5%{left:-63px; top:5%;} 6%{left:-54px; top:6%;} 7%{left:-46px; top:7%;} 8%{left:-39px; top:8%;} 9%{left:-32px; top:9%;} 10%{left:-26px; top:10%;} 11%{left:-21px; top:11%;} 12%{left:-17px; top:12%;} 13%{left:-14px; top:13%;} 14%{left:-12px; top:14%;} 15%{left:-11px; top:15%;} 16%{left:-11px; top:16%;} 17%{left:-11px; top:17%;} 18%{left:-13px; top:18%;} 19%{left:-16px; top:19%;} 20%{left:-20px; top:20%;} 21%{left:-24px; top:21%;} 22%{left:-30px; top:22%;} 23%{left:-36px; top:23%;} 24%{left:-43px; top:24%;} 25%{left:-51px; top:25%;} 26%{left:-59px; top:26%;} 27%{left:-68px; top:27%;} 28%{left:-77px; top:28%;} 29%{left:-87px; top:29%;} 30%{left:-96px; top:30%;} 31%{left:-106px; top:31%;} 32%{left:-116px; top:32%;} 33%{left:-126px; top:33%;} 34%{left:-136px; top:34%;} 35%{left:-146px; top:35%;} 36%{left:-155px; top:36%;} 37%{left:-163px; top:37%;} 38%{left:-172px; top:38%;} 39%{left:-179px; top:39%;} 40%{left:-186px; top:40%;} 41%{left:-192px; top:41%;} 42%{left:-198px; top:42%;} 43%{left:-202px; top:43%;} 44%{left:-206px; top:44%;} 45%{left:-208px; top:45%;} 46%{left:-210px; top:46%;} 47%{left:-210px; top:47%;} 48%{left:-210px; top:48%;} 49%{left:-209px; top:49%;} 50%{left:-206px; top:50%;} 51%{left:-203px; top:51%;} 52%{left:-199px; top:52%;} 53%{left:-194px; top:53%;} 54%{left:-188px; top:54%;} 55%{left:-181px; top:55%;} 56%{left:-174px; top:56%;} 57%{left:-166px; top:57%;} 58%{left:-157px; top:58%;} 59%{left:-148px; top:59%;} 60%{left:-138px; top:60%;} 61%{left:-129px; top:61%;} 62%{left:-119px; top:62%;} 63%{left:-109px; top:63%;} 64%{left:-99px; top:64%;} 65%{left:-89px; top:65%;} 66%{left:-79px; top:66%;} 67%{left:-70px; top:67%;} 68%{left:-61px; top:68%;} 69%{left:-53px; top:69%;} 70%{left:-45px; top:70%;} 71%{left:-38px; top:71%;} 72%{left:-31px; top:72%;} 73%{left:-25px; top:73%;} 74%{left:-21px; top:74%;} 75%{left:-17px; top:75%;} 76%{left:-14px; top:76%;} 77%{left:-12px; top:77%;} 78%{left:-11px; top:78%;} 79%{left:-11px; top:79%;} 80%{left:-12px; top:80%;} 81%{left:-14px; top:81%;} 82%{left:-16px; top:82%;} 83%{left:-20px; top:83%;} 84%{left:-25px; top:84%;} 85%{left:-31px; top:85%;} 86%{left:-37px; top:86%;} 87%{left:-44px; top:87%;} 88%{left:-52px; top:88%;} 89%{left:-60px; top:89%;} 90%{left:-69px; top:90%;} 91%{left:-79px; top:91%;} 92%{left:-88px; top:92%;} 93%{left:-98px; top:93%;} 94%{left:-108px; top:94%;} 95%{left:-118px; top:95%;} 96%{left:-128px; top:96%;} 97%{left:-138px; top:97%;} 98%{left:-147px; top:98%;} 99%{left:-156px; top:99%;} 100%{left:-165px; top:100%;} }</style><span style="left:110vw;"><div style="animation-delay:15.6s;"></div></span><span style="left:100vw;"><div style="animation-delay:5.8s;"></div></span><span style="left:90vw;"><div style="animation-delay:8.8s;"></div></span><span style="left:80vw;"><div style="animation-delay:9.6s;"></div></span><span style="left:70vw;"><div style="animation-delay:14.5s;"></div></span><span style="left:60vw;"><div style="animation-delay:7.6s;"></div></span><span style="left:50vw;"><div style="animation-delay:2.2s;"></div></span><span style="left:40vw;"><div style="animation-delay:2.4s;"></div></span><span style="left:30vw;"><div style="animation-delay:7.2s;"></div></span><span style="left:20vw;"><div style="animation-delay:2s;"></div></span><span style="left:10vw;"><div style="animation-delay:4.6s;"></div></span><span style="left:0vw;"><div style="animation-delay:7.2s;"></div></span><span style="left:-10vw;"><div style="animation-delay:3.7s;"></div></span></section>
waow
demo
clone
id: 3978493126
source: (triple click to highlight all)
<section id="snowflakes3978493126"><!--snowflakes(v1) generated with: https://snowfallgarden.lophius.xyz--><style>#snowflakes3978493126 { overflow:hidden; pointer-events:none; image-rendering:pixelated; } #snowflakes3978493126 > span { position:fixed; top:-35px; height:calc(100vh + 35px); } #snowflakes3978493126 span div { width:35px; height:35px; position:relative; background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACMAAAAjCAYAAAAe2bNZAAAAAXNSR0IArs4c6QAAANZJREFUWEftl9sKxCAMRM3/f7SLywZCiDqTUpQlfaltvYwnk0ilXXTJRVpaiZlFo8gUGTZT/8szvfcuIqJ3lobtnyLjF949owIpMRGF8U4XG4RGO0uLEmMX2u02EzZYjBKI/DELkx2zEz++w2L8ZFbArI0IeGxgncDT+u7u5xtWCExmFf/IwCuKK5FwmCIKSsJmj82sVzxzHZkI7xHPzIT4IsfUoWjOtGds1hyrM2hlRful68x1Z1PkiyOn9srImbD4+WADZ8o7O6bE1K9KeYYlUJ5hiX0AF9rcJEYJkJoAAAAASUVORK5CYII=); animation: sine 15s linear 0s infinite normal;} @keyframes sine { 0%{left:-110px; top:0%;} 1%{left:-101px; top:1%;} 2%{left:-91px; top:2%;} 3%{left:-81px; top:3%;} 4%{left:-72px; top:4%;} 5%{left:-63px; top:5%;} 6%{left:-54px; top:6%;} 7%{left:-46px; top:7%;} 8%{left:-39px; top:8%;} 9%{left:-32px; top:9%;} 10%{left:-26px; top:10%;} 11%{left:-21px; top:11%;} 12%{left:-17px; top:12%;} 13%{left:-14px; top:13%;} 14%{left:-12px; top:14%;} 15%{left:-11px; top:15%;} 16%{left:-11px; top:16%;} 17%{left:-11px; top:17%;} 18%{left:-13px; top:18%;} 19%{left:-16px; top:19%;} 20%{left:-20px; top:20%;} 21%{left:-24px; top:21%;} 22%{left:-30px; top:22%;} 23%{left:-36px; top:23%;} 24%{left:-43px; top:24%;} 25%{left:-51px; top:25%;} 26%{left:-59px; top:26%;} 27%{left:-68px; top:27%;} 28%{left:-77px; top:28%;} 29%{left:-87px; top:29%;} 30%{left:-96px; top:30%;} 31%{left:-106px; top:31%;} 32%{left:-116px; top:32%;} 33%{left:-126px; top:33%;} 34%{left:-136px; top:34%;} 35%{left:-146px; top:35%;} 36%{left:-155px; top:36%;} 37%{left:-163px; top:37%;} 38%{left:-172px; top:38%;} 39%{left:-179px; top:39%;} 40%{left:-186px; top:40%;} 41%{left:-192px; top:41%;} 42%{left:-198px; top:42%;} 43%{left:-202px; top:43%;} 44%{left:-206px; top:44%;} 45%{left:-208px; top:45%;} 46%{left:-210px; top:46%;} 47%{left:-210px; top:47%;} 48%{left:-210px; top:48%;} 49%{left:-209px; top:49%;} 50%{left:-206px; top:50%;} 51%{left:-203px; top:51%;} 52%{left:-199px; top:52%;} 53%{left:-194px; top:53%;} 54%{left:-188px; top:54%;} 55%{left:-181px; top:55%;} 56%{left:-174px; top:56%;} 57%{left:-166px; top:57%;} 58%{left:-157px; top:58%;} 59%{left:-148px; top:59%;} 60%{left:-138px; top:60%;} 61%{left:-129px; top:61%;} 62%{left:-119px; top:62%;} 63%{left:-109px; top:63%;} 64%{left:-99px; top:64%;} 65%{left:-89px; top:65%;} 66%{left:-79px; top:66%;} 67%{left:-70px; top:67%;} 68%{left:-61px; top:68%;} 69%{left:-53px; top:69%;} 70%{left:-45px; top:70%;} 71%{left:-38px; top:71%;} 72%{left:-31px; top:72%;} 73%{left:-25px; top:73%;} 74%{left:-21px; top:74%;} 75%{left:-17px; top:75%;} 76%{left:-14px; top:76%;} 77%{left:-12px; top:77%;} 78%{left:-11px; top:78%;} 79%{left:-11px; top:79%;} 80%{left:-12px; top:80%;} 81%{left:-14px; top:81%;} 82%{left:-16px; top:82%;} 83%{left:-20px; top:83%;} 84%{left:-25px; top:84%;} 85%{left:-31px; top:85%;} 86%{left:-37px; top:86%;} 87%{left:-44px; top:87%;} 88%{left:-52px; top:88%;} 89%{left:-60px; top:89%;} 90%{left:-69px; top:90%;} 91%{left:-79px; top:91%;} 92%{left:-88px; top:92%;} 93%{left:-98px; top:93%;} 94%{left:-108px; top:94%;} 95%{left:-118px; top:95%;} 96%{left:-128px; top:96%;} 97%{left:-138px; top:97%;} 98%{left:-147px; top:98%;} 99%{left:-156px; top:99%;} 100%{left:-165px; top:100%;} }</style><span style="left:110vw;"><div style="animation-delay:0.1s;"></div></span><span style="left:100vw;"><div style="animation-delay:4.6s;"></div></span><span style="left:90vw;"><div style="animation-delay:2.5s;"></div></span><span style="left:80vw;"><div style="animation-delay:15.9s;"></div></span><span style="left:70vw;"><div style="animation-delay:19.4s;"></div></span><span style="left:60vw;"><div style="animation-delay:5.8s;"></div></span><span style="left:50vw;"><div style="animation-delay:0.6s;"></div></span><span style="left:40vw;"><div style="animation-delay:12.3s;"></div></span><span style="left:30vw;"><div style="animation-delay:3.1s;"></div></span><span style="left:20vw;"><div style="animation-delay:0.4s;"></div></span><span style="left:10vw;"><div style="animation-delay:18.1s;"></div></span><span style="left:0vw;"><div style="animation-delay:17.8s;"></div></span><span style="left:-10vw;"><div style="animation-delay:14.2s;"></div></span></section>
heylmaoX3
https://heylmao-x3.neocities.org
demo
clone
id: 2595197553
idk
source: (triple click to highlight all)
<section id="snowflakes2595197553"><!--snowflakes(v1) generated with: https://snowfallgarden.lophius.xyz--><style>#snowflakes2595197553 { overflow:hidden; pointer-events:none; image-rendering:pixelated; } #snowflakes2595197553 > span { position:fixed; top:-65px; height:calc(100vh + 65px); } #snowflakes2595197553 span div { width:65px; height:65px; position:relative; background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEEAAABBCAYAAACO98lFAAAAAXNSR0IArs4c6QAACERJREFUeF7tm/tvHFcVxz9n1l7bieM4TlIKhaTkQRJI0zR17BgCTVoQKo8KJJKIf4C2PwTUIgRIJJ4k9IeKHxCgSqgCfkAgUfpDIwFVKZDyTGwnpE3VGEoa07SlvByndt31a3cOnJmdZGKv453ZWceWfCVrV6uZe8/53u953mthYSALGLAAgpFggQkLIATOYIEJ8wUEV9Whl5rBQTK2c0s7GHNFvLSc+txlgqrsf4lscz9bHeE+gfUKy0UYA3oB122Xv6UBxJwDwXY9383ajPCgwG5gnRIwIDoEfkYbn0qDEXMKhAPH9RbH4UGETwLLZ9hlTxxudbfLC5WyYc6A4PboXlW+DzTGUOq7h9rl/hjPl3x0ToBwsFvvdeCRUrS/poLKr2WEu93dkq8EiOsOgtutn1B4AqhJoEiv5Ljd3S2jCd69/Mp1BcHt0h0Iv1WoS6jEecmxed6CcKBH73CUp4D6hABYpneOHFvmJQjucV1HhucUFicFoPhe71CB1m++X0YqmWfWzcE9q1kd9n3AxyoRvPjuxdEMax9ulcFK5ppdEFTF7eFehW/EDIXThbYxHFrdVs4iokmBmFUQvnpaV9ZN8Ctgi6ZQvAm8hcdmt0NeTgrArFaRlg57PXzJgYdi5wPTazjkwYeOtMuZOQ/C505p7Y157hHhR5VEg2kUfT6f556HPiAXkgJRdXNwu/U9wKPAzhQZcHUxJXzL3c4DSf1CVUFwT+g2HJ5UeFvSXSrnPYF/4rDT3S595Tw/+ZmqgeCe1M3q8RvghkklsKbhFKcoKxw+1CadcwYE95RupMAxhbcnESrhO09Ljo8nKaZSZ4IBoAU/DL4zoTKJXhN4lQwb3VbJxZ0gVRCKDHhKYXUpQWwxEchIkCTYd7ONvAdJGoYChdDZ2nc82twOOX3dQLA8QLv5JcKHJwvhWJ3sBH/OJNgtzTMQxgpxRZ/6vAiPuNvZHzdKpMaEgz26z1F+HA2DNnk2EygfLhR+RnPcibRAgF+8nuHTj7bKRBxIUwHB7dGtKL9XWBIubpQ3AELq2++h4v6nBibgFc3BeF3pEOVPF5dz13fWi3Wkyx4Vg9B5SldJgacVNoSr1jp4WQfHbD46TNGJQmDIKehcSsmugRZ2zT4I3foYsDeUqM5BazNXn2wVPBj3AuXTGqXMCph9EA5260cFfh72B7NOYAImYKjveAHM5lPUn0U10JQFm/vNiWD+4phdEL52QjdlHLqAJhOg1oG6yBGJKR0CkNbu2zwWadY3w7K6gF3nB2Fo/DLIsweCfzbYw1HFPyTxw15DBhUJzMBivwkY2aHUcDAWbF0RgG7m9ZdLMDB6GYTjAy3cOSs+4UCX3u4If7Sy2LSutyhgW1QcFvOrAYCtdVMjrGkKTM5AeK4fhq8ExGPSyN3u+2Q8Duqxo0ORBT9R2GMLhX4gXDStmF9KCQu3722BlmKDPpcPQIgAflRy7IlbP8QG4YHj2tCUwc7/1tjmN9QE6a8Ni/kj+XSdYBQMM4HbVvqm5zva19+CvsGrUu7v9V7gvsf3Sqz8MzYI7gndpY5fIjvmCC0nKPorRvOQTzMMTKLDYvMHK6GmWDScHYBLkbRIlCNuO53VS5utU3yCZerwmNUHRk1jQTgs/x+NhX8cqw18wE2LYc3S4Ls53mf/S2G0EBzb+wWUss3dIc/Hm7ncjq+qdJ7kyyhfEFhp9YFRMnSGFg1GCoE5VGvY7m9ZAUtqgxXMGZ7px8urHzVt9EuOd7u7ZTiuDGWZg/usNus454EWWyBkgQR6O5YP2M5Uc5gzNKdoaxvWrw7Dy0NX/I/Ai4MFbktyGlUWCF/5gy6rz/IPhYZoRDAQPMUxL11FEviKb1oGy4unlgb4mX6wdSPjaO8FPhPXKRZNaeb9mwyC+QITzEa1fYGtceMiWLf0Cgv+nYNzb2AlyeUcVeCQ2y7uzNpMfSIRE6IgVNsUmmphU0uQkNmwRKx3AIYiHQP/JCpjx3Hy16qBUPQJdrjh1wlZqxQd/Dt0BkKa1WFUCVN84zJYmg1+tfVeeTP4i5pfpZe4ymKC+4zWs4jTCptCGwodVLUAMLZZemx+IBTScgKrFaIpuViLwuODRzqkOwkLyvYJ9qDbrd9W2B8uVOyRlgViHOFsQguDlg9YuRwuYJmoATA8caW5Wpz3mLTxkUqu8pWthHtCb1aH3wGr4ihV7rMW7K0XsaIB3rE4SI3DYVGgbwguTr2ZlBOlI0mCFJWrbBDspc4u3SmCtdSn3DCJtr+nU9wWs6arDUuwfCoKWDp8w6KgMAqbMlEAXhpEL41d3a0yM/Bg3+F2sQsfFY1YINhKB7q1wwm6SX7iVGqUAsRsfFUjNNcF/Ycwu7Tv5l/sMyqMp3iD4zjGgEipHAAHIx7sOdzGk3HrhGnkjQ+i3TzNODyswl3G4hlm8Mx/tNSTWdsE9VZ1Tv+CeiC5CfhXDv4zMsUJWnXSA3zebZdT8SWfdtOSTeX3FU6yRZUjwK6Zrt8Y5Vc3QXO2xAGMdaG9oF9odv/GWMk0vF+U+8++whNJssJraRnbHCZP5l/I7mJDjfBZhK0KtxbPISO9pmD3jfZWfvsHMmHGqUECZCBYuJ1UhFkx1INyvAA//PoOOZdsy679VsUgRKd3n9EalpDVPNsQvgjcIrBKoVj7FZ3hJJkiiU9e4O/ACx782YHHydEXt1MUF6hUQYguvuenmlm9gfrGCd7lFdgnwkZR/6h+8uVNSwQHFF70hB8M5+l77TXG06Z8Vc0hLupz8fmqMWEuKnuNkD6fxK2OrAtMmC//DVed/b8y6wITFphQOm+pNvPm5PwL5vD/bfkfgsjaYApd/PgAAAAASUVORK5CYII=); animation: sine 15s linear 0s infinite normal;} @keyframes sine { 0%{left:-110px; top:0%;} 1%{left:-101px; top:1%;} 2%{left:-91px; top:2%;} 3%{left:-81px; top:3%;} 4%{left:-72px; top:4%;} 5%{left:-63px; top:5%;} 6%{left:-54px; top:6%;} 7%{left:-46px; top:7%;} 8%{left:-39px; top:8%;} 9%{left:-32px; top:9%;} 10%{left:-26px; top:10%;} 11%{left:-21px; top:11%;} 12%{left:-17px; top:12%;} 13%{left:-14px; top:13%;} 14%{left:-12px; top:14%;} 15%{left:-11px; top:15%;} 16%{left:-11px; top:16%;} 17%{left:-11px; top:17%;} 18%{left:-13px; top:18%;} 19%{left:-16px; top:19%;} 20%{left:-20px; top:20%;} 21%{left:-24px; top:21%;} 22%{left:-30px; top:22%;} 23%{left:-36px; top:23%;} 24%{left:-43px; top:24%;} 25%{left:-51px; top:25%;} 26%{left:-59px; top:26%;} 27%{left:-68px; top:27%;} 28%{left:-77px; top:28%;} 29%{left:-87px; top:29%;} 30%{left:-96px; top:30%;} 31%{left:-106px; top:31%;} 32%{left:-116px; top:32%;} 33%{left:-126px; top:33%;} 34%{left:-136px; top:34%;} 35%{left:-146px; top:35%;} 36%{left:-155px; top:36%;} 37%{left:-163px; top:37%;} 38%{left:-172px; top:38%;} 39%{left:-179px; top:39%;} 40%{left:-186px; top:40%;} 41%{left:-192px; top:41%;} 42%{left:-198px; top:42%;} 43%{left:-202px; top:43%;} 44%{left:-206px; top:44%;} 45%{left:-208px; top:45%;} 46%{left:-210px; top:46%;} 47%{left:-210px; top:47%;} 48%{left:-210px; top:48%;} 49%{left:-209px; top:49%;} 50%{left:-206px; top:50%;} 51%{left:-203px; top:51%;} 52%{left:-199px; top:52%;} 53%{left:-194px; top:53%;} 54%{left:-188px; top:54%;} 55%{left:-181px; top:55%;} 56%{left:-174px; top:56%;} 57%{left:-166px; top:57%;} 58%{left:-157px; top:58%;} 59%{left:-148px; top:59%;} 60%{left:-138px; top:60%;} 61%{left:-129px; top:61%;} 62%{left:-119px; top:62%;} 63%{left:-109px; top:63%;} 64%{left:-99px; top:64%;} 65%{left:-89px; top:65%;} 66%{left:-79px; top:66%;} 67%{left:-70px; top:67%;} 68%{left:-61px; top:68%;} 69%{left:-53px; top:69%;} 70%{left:-45px; top:70%;} 71%{left:-38px; top:71%;} 72%{left:-31px; top:72%;} 73%{left:-25px; top:73%;} 74%{left:-21px; top:74%;} 75%{left:-17px; top:75%;} 76%{left:-14px; top:76%;} 77%{left:-12px; top:77%;} 78%{left:-11px; top:78%;} 79%{left:-11px; top:79%;} 80%{left:-12px; top:80%;} 81%{left:-14px; top:81%;} 82%{left:-16px; top:82%;} 83%{left:-20px; top:83%;} 84%{left:-25px; top:84%;} 85%{left:-31px; top:85%;} 86%{left:-37px; top:86%;} 87%{left:-44px; top:87%;} 88%{left:-52px; top:88%;} 89%{left:-60px; top:89%;} 90%{left:-69px; top:90%;} 91%{left:-79px; top:91%;} 92%{left:-88px; top:92%;} 93%{left:-98px; top:93%;} 94%{left:-108px; top:94%;} 95%{left:-118px; top:95%;} 96%{left:-128px; top:96%;} 97%{left:-138px; top:97%;} 98%{left:-147px; top:98%;} 99%{left:-156px; top:99%;} 100%{left:-165px; top:100%;} }</style><span style="left:110vw;"><div style="animation-delay:9.7s;"></div></span><span style="left:100vw;"><div style="animation-delay:5.5s;"></div></span><span style="left:90vw;"><div style="animation-delay:19.5s;"></div></span><span style="left:80vw;"><div style="animation-delay:5.9s;"></div></span><span style="left:70vw;"><div style="animation-delay:10.6s;"></div></span><span style="left:60vw;"><div style="animation-delay:1.8s;"></div></span><span style="left:50vw;"><div style="animation-delay:18.2s;"></div></span><span style="left:40vw;"><div style="animation-delay:3s;"></div></span><span style="left:30vw;"><div style="animation-delay:5.4s;"></div></span><span style="left:20vw;"><div style="animation-delay:10.9s;"></div></span><span style="left:10vw;"><div style="animation-delay:6.8s;"></div></span><span style="left:0vw;"><div style="animation-delay:7.9s;"></div></span><span style="left:-10vw;"><div style="animation-delay:11.7s;"></div></span></section>
2
demo
clone
id: 2042632543
source: (triple click to highlight all)
<section id="snowflakes2042632543"><!--snowflakes(v1) generated with: https://snowfallgarden.lophius.xyz--><style>#snowflakes2042632543 { overflow:hidden; pointer-events:none; image-rendering:pixelated; } #snowflakes2042632543 > span { position:fixed; top:-11px; height:calc(100vh + 11px); } #snowflakes2042632543 span div { width:12px; height:11px; position:relative; background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAALCAYAAABLcGxfAAAAAXNSR0IArs4c6QAAAGBJREFUKFNjZMAC2gsZ/oOEK/sZGNGlMQRAip2iPcDq9i3dgaGJPA0wJ4BMhZkOcwrIFhgAOZER2QnY/IMsBtJMugaQCcTYAgsAuKfxaUIOLepogIUMtvhAiQf0GMYW4wDhCT/6HkWjvwAAAABJRU5ErkJggg==); animation: sine 15s linear 0s infinite normal;} @keyframes sine { 0%{left:-110px; top:0%;} 1%{left:-101px; top:1%;} 2%{left:-91px; top:2%;} 3%{left:-81px; top:3%;} 4%{left:-72px; top:4%;} 5%{left:-63px; top:5%;} 6%{left:-54px; top:6%;} 7%{left:-46px; top:7%;} 8%{left:-39px; top:8%;} 9%{left:-32px; top:9%;} 10%{left:-26px; top:10%;} 11%{left:-21px; top:11%;} 12%{left:-17px; top:12%;} 13%{left:-14px; top:13%;} 14%{left:-12px; top:14%;} 15%{left:-11px; top:15%;} 16%{left:-11px; top:16%;} 17%{left:-11px; top:17%;} 18%{left:-13px; top:18%;} 19%{left:-16px; top:19%;} 20%{left:-20px; top:20%;} 21%{left:-24px; top:21%;} 22%{left:-30px; top:22%;} 23%{left:-36px; top:23%;} 24%{left:-43px; top:24%;} 25%{left:-51px; top:25%;} 26%{left:-59px; top:26%;} 27%{left:-68px; top:27%;} 28%{left:-77px; top:28%;} 29%{left:-87px; top:29%;} 30%{left:-96px; top:30%;} 31%{left:-106px; top:31%;} 32%{left:-116px; top:32%;} 33%{left:-126px; top:33%;} 34%{left:-136px; top:34%;} 35%{left:-146px; top:35%;} 36%{left:-155px; top:36%;} 37%{left:-163px; top:37%;} 38%{left:-172px; top:38%;} 39%{left:-179px; top:39%;} 40%{left:-186px; top:40%;} 41%{left:-192px; top:41%;} 42%{left:-198px; top:42%;} 43%{left:-202px; top:43%;} 44%{left:-206px; top:44%;} 45%{left:-208px; top:45%;} 46%{left:-210px; top:46%;} 47%{left:-210px; top:47%;} 48%{left:-210px; top:48%;} 49%{left:-209px; top:49%;} 50%{left:-206px; top:50%;} 51%{left:-203px; top:51%;} 52%{left:-199px; top:52%;} 53%{left:-194px; top:53%;} 54%{left:-188px; top:54%;} 55%{left:-181px; top:55%;} 56%{left:-174px; top:56%;} 57%{left:-166px; top:57%;} 58%{left:-157px; top:58%;} 59%{left:-148px; top:59%;} 60%{left:-138px; top:60%;} 61%{left:-129px; top:61%;} 62%{left:-119px; top:62%;} 63%{left:-109px; top:63%;} 64%{left:-99px; top:64%;} 65%{left:-89px; top:65%;} 66%{left:-79px; top:66%;} 67%{left:-70px; top:67%;} 68%{left:-61px; top:68%;} 69%{left:-53px; top:69%;} 70%{left:-45px; top:70%;} 71%{left:-38px; top:71%;} 72%{left:-31px; top:72%;} 73%{left:-25px; top:73%;} 74%{left:-21px; top:74%;} 75%{left:-17px; top:75%;} 76%{left:-14px; top:76%;} 77%{left:-12px; top:77%;} 78%{left:-11px; top:78%;} 79%{left:-11px; top:79%;} 80%{left:-12px; top:80%;} 81%{left:-14px; top:81%;} 82%{left:-16px; top:82%;} 83%{left:-20px; top:83%;} 84%{left:-25px; top:84%;} 85%{left:-31px; top:85%;} 86%{left:-37px; top:86%;} 87%{left:-44px; top:87%;} 88%{left:-52px; top:88%;} 89%{left:-60px; top:89%;} 90%{left:-69px; top:90%;} 91%{left:-79px; top:91%;} 92%{left:-88px; top:92%;} 93%{left:-98px; top:93%;} 94%{left:-108px; top:94%;} 95%{left:-118px; top:95%;} 96%{left:-128px; top:96%;} 97%{left:-138px; top:97%;} 98%{left:-147px; top:98%;} 99%{left:-156px; top:99%;} 100%{left:-165px; top:100%;} }</style><span style="left:110vw;"><div style="animation-delay:4.9s;"></div></span><span style="left:100vw;"><div style="animation-delay:4.6s;"></div></span><span style="left:90vw;"><div style="animation-delay:6.8s;"></div></span><span style="left:80vw;"><div style="animation-delay:4.5s;"></div></span><span style="left:70vw;"><div style="animation-delay:8.1s;"></div></span><span style="left:60vw;"><div style="animation-delay:1.4s;"></div></span><span style="left:50vw;"><div style="animation-delay:4.2s;"></div></span><span style="left:40vw;"><div style="animation-delay:17.2s;"></div></span><span style="left:30vw;"><div style="animation-delay:1.6s;"></div></span><span style="left:20vw;"><div style="animation-delay:3.3s;"></div></span><span style="left:10vw;"><div style="animation-delay:4.2s;"></div></span><span style="left:0vw;"><div style="animation-delay:8.1s;"></div></span><span style="left:-10vw;"><div style="animation-delay:10.1s;"></div></span></section>
rozwielitko
demo
clone
id: 1107296845
source: (triple click to highlight all)
<section id="snowflakes1107296845"><!--snowflakes(v1) generated with: https://snowfallgarden.lophius.xyz--><style>#snowflakes1107296845 { overflow:hidden; pointer-events:none; image-rendering:pixelated; } #snowflakes1107296845 > span { position:fixed; top:-23px; height:calc(100vh + 23px); } #snowflakes1107296845 span div { width:24px; height:23px; position:relative; background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAXCAYAAAARIY8tAAAAAXNSR0IArs4c6QAAANlJREFUSEu1lb0RwzAIhaXVUnmHTJEyE7jMFN4hVVZLDt2Re8b8GEl244LT+wQ8UC2d3/ooXzr6fJXqSbhB6yCLc9yDpAEsfrsvTf+zvdvfgqQAUjwFkGnLW2nipwGauFZ/LgvGwhJZN8PbseB0wBkHhxmQiJdFBGGA5aS/i0Ygspxo2Z1Nr4Ac5mAUIq17CQAhU0ukzceUJqOTEELNboDRumsAdlKNxPGwNsnRPtplEA0VxbPr4tADCcGh6dmoqffA65e1k9IACzIVgBCvpBTryoBF8aGy3uQfVuOIBqblIEMAAAAASUVORK5CYII=); animation: sine 15s linear 0s infinite normal;} @keyframes sine { 0%{left:-110px; top:0%;} 1%{left:-101px; top:1%;} 2%{left:-91px; top:2%;} 3%{left:-81px; top:3%;} 4%{left:-72px; top:4%;} 5%{left:-63px; top:5%;} 6%{left:-54px; top:6%;} 7%{left:-46px; top:7%;} 8%{left:-39px; top:8%;} 9%{left:-32px; top:9%;} 10%{left:-26px; top:10%;} 11%{left:-21px; top:11%;} 12%{left:-17px; top:12%;} 13%{left:-14px; top:13%;} 14%{left:-12px; top:14%;} 15%{left:-11px; top:15%;} 16%{left:-11px; top:16%;} 17%{left:-11px; top:17%;} 18%{left:-13px; top:18%;} 19%{left:-16px; top:19%;} 20%{left:-20px; top:20%;} 21%{left:-24px; top:21%;} 22%{left:-30px; top:22%;} 23%{left:-36px; top:23%;} 24%{left:-43px; top:24%;} 25%{left:-51px; top:25%;} 26%{left:-59px; top:26%;} 27%{left:-68px; top:27%;} 28%{left:-77px; top:28%;} 29%{left:-87px; top:29%;} 30%{left:-96px; top:30%;} 31%{left:-106px; top:31%;} 32%{left:-116px; top:32%;} 33%{left:-126px; top:33%;} 34%{left:-136px; top:34%;} 35%{left:-146px; top:35%;} 36%{left:-155px; top:36%;} 37%{left:-163px; top:37%;} 38%{left:-172px; top:38%;} 39%{left:-179px; top:39%;} 40%{left:-186px; top:40%;} 41%{left:-192px; top:41%;} 42%{left:-198px; top:42%;} 43%{left:-202px; top:43%;} 44%{left:-206px; top:44%;} 45%{left:-208px; top:45%;} 46%{left:-210px; top:46%;} 47%{left:-210px; top:47%;} 48%{left:-210px; top:48%;} 49%{left:-209px; top:49%;} 50%{left:-206px; top:50%;} 51%{left:-203px; top:51%;} 52%{left:-199px; top:52%;} 53%{left:-194px; top:53%;} 54%{left:-188px; top:54%;} 55%{left:-181px; top:55%;} 56%{left:-174px; top:56%;} 57%{left:-166px; top:57%;} 58%{left:-157px; top:58%;} 59%{left:-148px; top:59%;} 60%{left:-138px; top:60%;} 61%{left:-129px; top:61%;} 62%{left:-119px; top:62%;} 63%{left:-109px; top:63%;} 64%{left:-99px; top:64%;} 65%{left:-89px; top:65%;} 66%{left:-79px; top:66%;} 67%{left:-70px; top:67%;} 68%{left:-61px; top:68%;} 69%{left:-53px; top:69%;} 70%{left:-45px; top:70%;} 71%{left:-38px; top:71%;} 72%{left:-31px; top:72%;} 73%{left:-25px; top:73%;} 74%{left:-21px; top:74%;} 75%{left:-17px; top:75%;} 76%{left:-14px; top:76%;} 77%{left:-12px; top:77%;} 78%{left:-11px; top:78%;} 79%{left:-11px; top:79%;} 80%{left:-12px; top:80%;} 81%{left:-14px; top:81%;} 82%{left:-16px; top:82%;} 83%{left:-20px; top:83%;} 84%{left:-25px; top:84%;} 85%{left:-31px; top:85%;} 86%{left:-37px; top:86%;} 87%{left:-44px; top:87%;} 88%{left:-52px; top:88%;} 89%{left:-60px; top:89%;} 90%{left:-69px; top:90%;} 91%{left:-79px; top:91%;} 92%{left:-88px; top:92%;} 93%{left:-98px; top:93%;} 94%{left:-108px; top:94%;} 95%{left:-118px; top:95%;} 96%{left:-128px; top:96%;} 97%{left:-138px; top:97%;} 98%{left:-147px; top:98%;} 99%{left:-156px; top:99%;} 100%{left:-165px; top:100%;} }</style><span style="left:110vw;"><div style="animation-delay:10.4s;"></div></span><span style="left:100vw;"><div style="animation-delay:3.8s;"></div></span><span style="left:90vw;"><div style="animation-delay:16.2s;"></div></span><span style="left:80vw;"><div style="animation-delay:11.1s;"></div></span><span style="left:70vw;"><div style="animation-delay:5.6s;"></div></span><span style="left:60vw;"><div style="animation-delay:2.1s;"></div></span><span style="left:50vw;"><div style="animation-delay:2.5s;"></div></span><span style="left:40vw;"><div style="animation-delay:1.3s;"></div></span><span style="left:30vw;"><div style="animation-delay:16.3s;"></div></span><span style="left:20vw;"><div style="animation-delay:9.8s;"></div></span><span style="left:10vw;"><div style="animation-delay:6.3s;"></div></span><span style="left:0vw;"><div style="animation-delay:9.8s;"></div></span><span style="left:-10vw;"><div style="animation-delay:9.5s;"></div></span></section>
BasementFlan
demo
clone
id: 3782846740
loss
source: (triple click to highlight all)
<section id="snowflakes3782846740"><!--snowflakes(v1) generated with: https://snowfallgarden.lophius.xyz--><style>#snowflakes3782846740 { overflow:hidden; pointer-events:none; image-rendering:pixelated; } #snowflakes3782846740 > span { position:fixed; top:-35px; height:calc(100vh + 35px); } #snowflakes3782846740 span div { width:35px; height:35px; position:relative; background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACMAAAAjCAYAAAAe2bNZAAADJklEQVRYR+2YTWgTQRTH39KTehSE0OJnFYSitFDiRzFRRGwU8SIuKjQFRYpaqqeWVsUP0ItaFBHrRxoosuhBDxJFtG7EaMFiQQShVBBpCHiQXlpPNe6b9k1md2eyu0msHvouyc7M/vc3//d28zba6/7zeSgzoi2nwUxeKFMFQDNNk8GYkUhRsWg6LZ3Pf3sD8zAya/6aM0v2bbRd78ej99CXWsPGHiy6U7E0Tac+QVVsnUvPVjME03bpLNzqOgelwnx5mrJdaO3uGD9GEDFEKBcMglBUj7bz70GcIRjalAiDgtHNjfCq+x7TlsIcmDwCPYnFUCkYUcfMfOCbQhAKBFLCbH8xCMneGr64pWMcXu7YFrhm0BmCEUFImICUMPcfr2JrKwGTGGktaI0955sbvLLSVi/5n91yZyLVvwBrJBsbLZxgCVHdBKkZEQbdba1P2CB+D+3nx1V6jn/nBYwwxvAE6Lpug8EDHA+FQq5bEQdUzxmWitqdgDDJ458B06Ut38I0po2ClhQml5shFGEMw+AAJcFYZ6ezC1ybEGE2XVvqdoZgng018cnmDW9LgiEHZFaGw2F4d/I7n/INg2cQUBBnmg52QSaTkaY1MAwBoEulwhCJCopS5emMCEPuBHXGaYsKSlyn5a2Q+vkPBrX/qtObh1GUgK80bY2fActBZRVVrAfGNBVrhpAAYZwhwokwXlrF7gvmjFczhAL0s6+tbmZ6XjCqxsoXjKoZopPFpgiBisF4aamAuDNeAnMGg/2Hs6kSe5Da+qOuzYyN3OZjYs14aXmmyUtgTmGoEeLUVofnbKLHpxr4dM3Cj/Z54V3bS+vujX6bOYdPxPkxqxleD1ZnxmK2b0UgmgsEgxoSLQIZMG6yyxzSj7FPAuIPPcw7hewfBUrVw744nOpoh6u916GhceYNlGpmcmq9siSWhVbA5Yt7obPnCdTVZfk6BHLBUBONq5wNNNvobBEjDIVfGAQRg2AQZGD4K5tCA7gzfmFYFoU7yY8zCMPdoPQ5PHTBoCMIpXIGIdChoDC72vYo0yeWhs2ZcmFQWGzG8cVQtjECENfiK88f+7GTK3sF0GYAAAAASUVORK5CYII=); animation: sine 15s linear 0s infinite normal;} @keyframes sine { 0%{left:-110px; top:0%;} 1%{left:-101px; top:1%;} 2%{left:-91px; top:2%;} 3%{left:-81px; top:3%;} 4%{left:-72px; top:4%;} 5%{left:-63px; top:5%;} 6%{left:-54px; top:6%;} 7%{left:-46px; top:7%;} 8%{left:-39px; top:8%;} 9%{left:-32px; top:9%;} 10%{left:-26px; top:10%;} 11%{left:-21px; top:11%;} 12%{left:-17px; top:12%;} 13%{left:-14px; top:13%;} 14%{left:-12px; top:14%;} 15%{left:-11px; top:15%;} 16%{left:-11px; top:16%;} 17%{left:-11px; top:17%;} 18%{left:-13px; top:18%;} 19%{left:-16px; top:19%;} 20%{left:-20px; top:20%;} 21%{left:-24px; top:21%;} 22%{left:-30px; top:22%;} 23%{left:-36px; top:23%;} 24%{left:-43px; top:24%;} 25%{left:-51px; top:25%;} 26%{left:-59px; top:26%;} 27%{left:-68px; top:27%;} 28%{left:-77px; top:28%;} 29%{left:-87px; top:29%;} 30%{left:-96px; top:30%;} 31%{left:-106px; top:31%;} 32%{left:-116px; top:32%;} 33%{left:-126px; top:33%;} 34%{left:-136px; top:34%;} 35%{left:-146px; top:35%;} 36%{left:-155px; top:36%;} 37%{left:-163px; top:37%;} 38%{left:-172px; top:38%;} 39%{left:-179px; top:39%;} 40%{left:-186px; top:40%;} 41%{left:-192px; top:41%;} 42%{left:-198px; top:42%;} 43%{left:-202px; top:43%;} 44%{left:-206px; top:44%;} 45%{left:-208px; top:45%;} 46%{left:-210px; top:46%;} 47%{left:-210px; top:47%;} 48%{left:-210px; top:48%;} 49%{left:-209px; top:49%;} 50%{left:-206px; top:50%;} 51%{left:-203px; top:51%;} 52%{left:-199px; top:52%;} 53%{left:-194px; top:53%;} 54%{left:-188px; top:54%;} 55%{left:-181px; top:55%;} 56%{left:-174px; top:56%;} 57%{left:-166px; top:57%;} 58%{left:-157px; top:58%;} 59%{left:-148px; top:59%;} 60%{left:-138px; top:60%;} 61%{left:-129px; top:61%;} 62%{left:-119px; top:62%;} 63%{left:-109px; top:63%;} 64%{left:-99px; top:64%;} 65%{left:-89px; top:65%;} 66%{left:-79px; top:66%;} 67%{left:-70px; top:67%;} 68%{left:-61px; top:68%;} 69%{left:-53px; top:69%;} 70%{left:-45px; top:70%;} 71%{left:-38px; top:71%;} 72%{left:-31px; top:72%;} 73%{left:-25px; top:73%;} 74%{left:-21px; top:74%;} 75%{left:-17px; top:75%;} 76%{left:-14px; top:76%;} 77%{left:-12px; top:77%;} 78%{left:-11px; top:78%;} 79%{left:-11px; top:79%;} 80%{left:-12px; top:80%;} 81%{left:-14px; top:81%;} 82%{left:-16px; top:82%;} 83%{left:-20px; top:83%;} 84%{left:-25px; top:84%;} 85%{left:-31px; top:85%;} 86%{left:-37px; top:86%;} 87%{left:-44px; top:87%;} 88%{left:-52px; top:88%;} 89%{left:-60px; top:89%;} 90%{left:-69px; top:90%;} 91%{left:-79px; top:91%;} 92%{left:-88px; top:92%;} 93%{left:-98px; top:93%;} 94%{left:-108px; top:94%;} 95%{left:-118px; top:95%;} 96%{left:-128px; top:96%;} 97%{left:-138px; top:97%;} 98%{left:-147px; top:98%;} 99%{left:-156px; top:99%;} 100%{left:-165px; top:100%;} }</style><span style="left:110vw;"><div style="animation-delay:3.3s;"></div></span><span style="left:100vw;"><div style="animation-delay:14.8s;"></div></span><span style="left:90vw;"><div style="animation-delay:17.8s;"></div></span><span style="left:80vw;"><div style="animation-delay:2.8s;"></div></span><span style="left:70vw;"><div style="animation-delay:19.6s;"></div></span><span style="left:60vw;"><div style="animation-delay:7.1s;"></div></span><span style="left:50vw;"><div style="animation-delay:17.8s;"></div></span><span style="left:40vw;"><div style="animation-delay:15.7s;"></div></span><span style="left:30vw;"><div style="animation-delay:1s;"></div></span><span style="left:20vw;"><div style="animation-delay:2.5s;"></div></span><span style="left:10vw;"><div style="animation-delay:7s;"></div></span><span style="left:0vw;"><div style="animation-delay:14s;"></div></span><span style="left:-10vw;"><div style="animation-delay:14.2s;"></div></span></section>
Tetra
https://ultra-tetra.neocities.org/
demo
clone
id: 281382432
Wanted to try and do the little white nodes from Nitrome's Fault Line for my shrine dedicated to the game.
source: (triple click to highlight all)
<section id="snowflakes281382432"><!--snowflakes(v1) generated with: https://snowfallgarden.lophius.xyz--><style>#snowflakes281382432 { overflow:hidden; pointer-events:none; image-rendering:pixelated; } #snowflakes281382432 > span { position:fixed; top:-23px; height:calc(100vh + 23px); } #snowflakes281382432 span div { width:22px; height:23px; position:relative; background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABYAAAAXCAYAAAAP6L+eAAAAAXNSR0IArs4c6QAAAidJREFUSEu1VT1oU1EU/t5QqBakkFDBIbYUhA66SEUEB6vgkJRABS3oIri0CR0S0EUc3M0giV0KXTrYwUJoAx1aQQIKiogu4uBgBqHFICpVweGZ7+q5nHfffYm19AzJzfn5zjlfzj03QILMXiqHrRc/kRnvx4NH9wLt1s0mfjZAO9NI0BuLV7BwfRlrrVoEOJcphGJjYvE/lR3FnfmS8TUf5au3w3fNzxaIutUPVRMwebToBdZ2+ulE7NAASwXSRn7irO2cwKyKHVDkLMDU1R83rb90aIG/n/yEuWIBGlQqdjvQvwWR4PerNRx8mTYdRqjQVUgAK3b1Pp0UIX92cHemEj5vvI8F297+Hs4EFXN6GpZcU+Q3k/4Y+IhA+HUp0N7ZoI4+DBjVL+ygEeYTwUkJeTbA5NeVzZWHRkXQHE6b8zN8Md9tvLXg56emY7Hk2VKhrcKpgJ7DoDG38GcylrAVAWf7WgwVWsHqBZScDuEELuI4CHwMrzuuaWwgZYC/dtJs443l3J33nsCHkME1HMaFTo1tDOMVvv0fMPnW/KYwZoC1HEGIW3gS4VnmV/y8HPvAGXCzQ84IDuAy1mOgMY73fdyk/aQB/dcLwvGLjJtuX4PT0U3q0zFGQO246bXpW0I6qQS7+0NunN0VzNRrbdJHbifbpOx6bfKe6wp77WPpgIs+cW0SUCqS/dztaRIg6YixESpo8L15ksj35omt65vnG7G9vtK/AY2koGf6byEeAAAAAElFTkSuQmCC); animation: sine 15s linear 0s infinite normal;} @keyframes sine { 0%{left:-110px; top:0%;} 1%{left:-101px; top:1%;} 2%{left:-91px; top:2%;} 3%{left:-81px; top:3%;} 4%{left:-72px; top:4%;} 5%{left:-63px; top:5%;} 6%{left:-54px; top:6%;} 7%{left:-46px; top:7%;} 8%{left:-39px; top:8%;} 9%{left:-32px; top:9%;} 10%{left:-26px; top:10%;} 11%{left:-21px; top:11%;} 12%{left:-17px; top:12%;} 13%{left:-14px; top:13%;} 14%{left:-12px; top:14%;} 15%{left:-11px; top:15%;} 16%{left:-11px; top:16%;} 17%{left:-11px; top:17%;} 18%{left:-13px; top:18%;} 19%{left:-16px; top:19%;} 20%{left:-20px; top:20%;} 21%{left:-24px; top:21%;} 22%{left:-30px; top:22%;} 23%{left:-36px; top:23%;} 24%{left:-43px; top:24%;} 25%{left:-51px; top:25%;} 26%{left:-59px; top:26%;} 27%{left:-68px; top:27%;} 28%{left:-77px; top:28%;} 29%{left:-87px; top:29%;} 30%{left:-96px; top:30%;} 31%{left:-106px; top:31%;} 32%{left:-116px; top:32%;} 33%{left:-126px; top:33%;} 34%{left:-136px; top:34%;} 35%{left:-146px; top:35%;} 36%{left:-155px; top:36%;} 37%{left:-163px; top:37%;} 38%{left:-172px; top:38%;} 39%{left:-179px; top:39%;} 40%{left:-186px; top:40%;} 41%{left:-192px; top:41%;} 42%{left:-198px; top:42%;} 43%{left:-202px; top:43%;} 44%{left:-206px; top:44%;} 45%{left:-208px; top:45%;} 46%{left:-210px; top:46%;} 47%{left:-210px; top:47%;} 48%{left:-210px; top:48%;} 49%{left:-209px; top:49%;} 50%{left:-206px; top:50%;} 51%{left:-203px; top:51%;} 52%{left:-199px; top:52%;} 53%{left:-194px; top:53%;} 54%{left:-188px; top:54%;} 55%{left:-181px; top:55%;} 56%{left:-174px; top:56%;} 57%{left:-166px; top:57%;} 58%{left:-157px; top:58%;} 59%{left:-148px; top:59%;} 60%{left:-138px; top:60%;} 61%{left:-129px; top:61%;} 62%{left:-119px; top:62%;} 63%{left:-109px; top:63%;} 64%{left:-99px; top:64%;} 65%{left:-89px; top:65%;} 66%{left:-79px; top:66%;} 67%{left:-70px; top:67%;} 68%{left:-61px; top:68%;} 69%{left:-53px; top:69%;} 70%{left:-45px; top:70%;} 71%{left:-38px; top:71%;} 72%{left:-31px; top:72%;} 73%{left:-25px; top:73%;} 74%{left:-21px; top:74%;} 75%{left:-17px; top:75%;} 76%{left:-14px; top:76%;} 77%{left:-12px; top:77%;} 78%{left:-11px; top:78%;} 79%{left:-11px; top:79%;} 80%{left:-12px; top:80%;} 81%{left:-14px; top:81%;} 82%{left:-16px; top:82%;} 83%{left:-20px; top:83%;} 84%{left:-25px; top:84%;} 85%{left:-31px; top:85%;} 86%{left:-37px; top:86%;} 87%{left:-44px; top:87%;} 88%{left:-52px; top:88%;} 89%{left:-60px; top:89%;} 90%{left:-69px; top:90%;} 91%{left:-79px; top:91%;} 92%{left:-88px; top:92%;} 93%{left:-98px; top:93%;} 94%{left:-108px; top:94%;} 95%{left:-118px; top:95%;} 96%{left:-128px; top:96%;} 97%{left:-138px; top:97%;} 98%{left:-147px; top:98%;} 99%{left:-156px; top:99%;} 100%{left:-165px; top:100%;} }</style><span style="left:110vw;"><div style="animation-delay:7.1s;"></div></span><span style="left:100vw;"><div style="animation-delay:1.4s;"></div></span><span style="left:90vw;"><div style="animation-delay:17.4s;"></div></span><span style="left:80vw;"><div style="animation-delay:1.4s;"></div></span><span style="left:70vw;"><div style="animation-delay:15.8s;"></div></span><span style="left:60vw;"><div style="animation-delay:20s;"></div></span><span style="left:50vw;"><div style="animation-delay:15.9s;"></div></span><span style="left:40vw;"><div style="animation-delay:4s;"></div></span><span style="left:30vw;"><div style="animation-delay:15.8s;"></div></span><span style="left:20vw;"><div style="animation-delay:1.3s;"></div></span><span style="left:10vw;"><div style="animation-delay:10.2s;"></div></span><span style="left:0vw;"><div style="animation-delay:16.8s;"></div></span><span style="left:-10vw;"><div style="animation-delay:9.9s;"></div></span></section>
nel
https://nelsnetcafe.com/
demo
clone
id: 940830290
thank you
source: (triple click to highlight all)
<section id="snowflakes940830290"><!--snowflakes(v1) generated with: https://snowfallgarden.lophius.xyz--><style>#snowflakes940830290 { overflow:hidden; pointer-events:none; image-rendering:pixelated; } #snowflakes940830290 > span { position:fixed; top:-16px; height:calc(100vh + 16px); } #snowflakes940830290 span div { width:16px; height:16px; position:relative; background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAwElEQVQ4T7WTwRHCIBBFPy14tgtoQIsJNa1d2IBWQBc52wLuhxCVgDqDcskA2bfvbyYGg8sM1uMtQKYYbQBcMN33uhcsDuKT4OSkC/ktgF3LTNjd6maPHc64JQtoHC6HR6TVQA6qfMlF9SJkVggXGdYL/ClDNgAe9iA0SfctAC+KRQuy2MMetfu1EaFoCzRKzFHWoqJeFb9EqAGNUWy6fwRYo5NndzVKsb4xSLPQGHz65XPV+2e7//4LrTnUZ8MGd9XMVxHq/yyqAAAAAElFTkSuQmCC); animation: sine 15s linear 0s infinite normal;} @keyframes sine { 0%{left:-110px; top:0%;} 1%{left:-101px; top:1%;} 2%{left:-91px; top:2%;} 3%{left:-81px; top:3%;} 4%{left:-72px; top:4%;} 5%{left:-63px; top:5%;} 6%{left:-54px; top:6%;} 7%{left:-46px; top:7%;} 8%{left:-39px; top:8%;} 9%{left:-32px; top:9%;} 10%{left:-26px; top:10%;} 11%{left:-21px; top:11%;} 12%{left:-17px; top:12%;} 13%{left:-14px; top:13%;} 14%{left:-12px; top:14%;} 15%{left:-11px; top:15%;} 16%{left:-11px; top:16%;} 17%{left:-11px; top:17%;} 18%{left:-13px; top:18%;} 19%{left:-16px; top:19%;} 20%{left:-20px; top:20%;} 21%{left:-24px; top:21%;} 22%{left:-30px; top:22%;} 23%{left:-36px; top:23%;} 24%{left:-43px; top:24%;} 25%{left:-51px; top:25%;} 26%{left:-59px; top:26%;} 27%{left:-68px; top:27%;} 28%{left:-77px; top:28%;} 29%{left:-87px; top:29%;} 30%{left:-96px; top:30%;} 31%{left:-106px; top:31%;} 32%{left:-116px; top:32%;} 33%{left:-126px; top:33%;} 34%{left:-136px; top:34%;} 35%{left:-146px; top:35%;} 36%{left:-155px; top:36%;} 37%{left:-163px; top:37%;} 38%{left:-172px; top:38%;} 39%{left:-179px; top:39%;} 40%{left:-186px; top:40%;} 41%{left:-192px; top:41%;} 42%{left:-198px; top:42%;} 43%{left:-202px; top:43%;} 44%{left:-206px; top:44%;} 45%{left:-208px; top:45%;} 46%{left:-210px; top:46%;} 47%{left:-210px; top:47%;} 48%{left:-210px; top:48%;} 49%{left:-209px; top:49%;} 50%{left:-206px; top:50%;} 51%{left:-203px; top:51%;} 52%{left:-199px; top:52%;} 53%{left:-194px; top:53%;} 54%{left:-188px; top:54%;} 55%{left:-181px; top:55%;} 56%{left:-174px; top:56%;} 57%{left:-166px; top:57%;} 58%{left:-157px; top:58%;} 59%{left:-148px; top:59%;} 60%{left:-138px; top:60%;} 61%{left:-129px; top:61%;} 62%{left:-119px; top:62%;} 63%{left:-109px; top:63%;} 64%{left:-99px; top:64%;} 65%{left:-89px; top:65%;} 66%{left:-79px; top:66%;} 67%{left:-70px; top:67%;} 68%{left:-61px; top:68%;} 69%{left:-53px; top:69%;} 70%{left:-45px; top:70%;} 71%{left:-38px; top:71%;} 72%{left:-31px; top:72%;} 73%{left:-25px; top:73%;} 74%{left:-21px; top:74%;} 75%{left:-17px; top:75%;} 76%{left:-14px; top:76%;} 77%{left:-12px; top:77%;} 78%{left:-11px; top:78%;} 79%{left:-11px; top:79%;} 80%{left:-12px; top:80%;} 81%{left:-14px; top:81%;} 82%{left:-16px; top:82%;} 83%{left:-20px; top:83%;} 84%{left:-25px; top:84%;} 85%{left:-31px; top:85%;} 86%{left:-37px; top:86%;} 87%{left:-44px; top:87%;} 88%{left:-52px; top:88%;} 89%{left:-60px; top:89%;} 90%{left:-69px; top:90%;} 91%{left:-79px; top:91%;} 92%{left:-88px; top:92%;} 93%{left:-98px; top:93%;} 94%{left:-108px; top:94%;} 95%{left:-118px; top:95%;} 96%{left:-128px; top:96%;} 97%{left:-138px; top:97%;} 98%{left:-147px; top:98%;} 99%{left:-156px; top:99%;} 100%{left:-165px; top:100%;} }</style><span style="left:110vw;"><div style="animation-delay:14.7s;"></div></span><span style="left:100vw;"><div style="animation-delay:7.7s;"></div></span><span style="left:90vw;"><div style="animation-delay:11s;"></div></span><span style="left:80vw;"><div style="animation-delay:11.8s;"></div></span><span style="left:70vw;"><div style="animation-delay:0.6s;"></div></span><span style="left:60vw;"><div style="animation-delay:16.9s;"></div></span><span style="left:50vw;"><div style="animation-delay:4.7s;"></div></span><span style="left:40vw;"><div style="animation-delay:18.6s;"></div></span><span style="left:30vw;"><div style="animation-delay:6.2s;"></div></span><span style="left:20vw;"><div style="animation-delay:2.1s;"></div></span><span style="left:10vw;"><div style="animation-delay:5.7s;"></div></span><span style="left:0vw;"><div style="animation-delay:12.7s;"></div></span><span style="left:-10vw;"><div style="animation-delay:18.1s;"></div></span></section>
nel
demo
clone
id: 3557996816
source: (triple click to highlight all)
<section id="snowflakes3557996816"><!--snowflakes(v1) generated with: https://snowfallgarden.lophius.xyz--><style>#snowflakes3557996816 { overflow:hidden; pointer-events:none; image-rendering:pixelated; } #snowflakes3557996816 > span { position:fixed; top:-32px; height:calc(100vh + 32px); } #snowflakes3557996816 span div { width:32px; height:32px; position:relative; background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAD/ElEQVRYR72X63WjUAyEcRlbx6UM1wFlxCnD1JEyQh1bBjufHpcLAYc9m7P8sM1LGo2kkXzr/v5YLr5yu/LcpYdkqDr9HHZmC+e6OE/drF+cfkxd91gfe+njCoDl8yn7sm6+OPKHeRy6ovN5kte8x/UtkFM/3wFYlnBuURaceLQ4zu8iBDMIuc79zu+D832cko1DX68ALEl3GZ5yMMpBRh9OYOXpCGec5/1g5kPO70/PWa/fOr74OwOgyIduHhTDKMc1zwBIR85AeX6u9FsdeEryHqhmbOh672na+DwCoJwT1ShDcjIIyNiLUX1joFKPLTkD5DSaY1hY6wQg3JuVkKn7rVd/yZwTsYI4BPDQE3dhSAezjBQZwUnNv85LUWoghRSQ96C+Ri/Ak9WFH4AgJW069gAUfeQ3iqkQmUUiRmAhusFyrtooYspoh3W8RIFaYRoz26bhkZaFrwDwD81hzNMgY8ojv2d5MmfQDQNC5M6hP9JACqG+iT4BGgsy2UcqWgBe9emg0g0eObI0NIVuBch1AbMWVcvJ6l2iUejIjq7xQCw9wURIRGUhATj1cEPuedGqyfPqbbjWQWWgXndGzIm6opv6qBe3kU6zDvh+OMe3CiDa1VvIYa8VL0dc8MjWFHRioIgZnLwr4LfFWzKZqqDCpBGRUq709UprBQAiclMVLzxRdIPlvuwKbq0BKzwVqAFMJninVUYzLcDItqmmi9Oagsh/jdxYSEkVjbBgheggN12AVkmzvVCxHe3qGVBaQy/Csb0rgAnA829VHW0mtbN2iyiMUotQ3WAInUtEyM45hSEVJIZrO3KdoqQlFa2BMyZduukEGKia75MNo5Fn8h5E4CVaJzNavxmX1g3Wvg6ew2Sa4g3xyInJuE5VdABRga6ywYSBcDBYPBsmgcJnR/Y9bMFEU5A+KUOsIsAtA0T/nwC0c2FbhElqzPIcLnMUjG6/Ht9owBDtWlOCKK7zoLrQDzGw6gAqSG6sFdstx5Rx6G4n83xXEEvWQ1XURjvy2aYGtgCsggOt9T76joFrDGDf6qmOZEoydSHy7/TzjBV1BVBfRo5DwmN8IhiG/bv1zW2wQNKOcVRV3FGVE/HLMGq3KtA+/MVLzo1+FplB7Uf/mGS4bhgQfXwIW7sTHO4D7HIcUDUerFG7YPLUW5ES4gofMVhMFwIIotU3QZ2sZHJMKq5H7/QzRFlaOGvXN7AwuiXVuQck6tOlNB64Qr07V/Qw92aCZAisq1A83+avL6UnDJ9eXtc4lCwiz2462gNbS1cjfAVqHWZoPxu0gPCHhGO/hO4N/QyAWDJ8dfMWNFHbbcBHUfwEgFoDrYMYXlz65z+nV2ti/7f9UnB/ANlNbjhqmeh3AAAAAElFTkSuQmCC); animation: sine 15s linear 0s infinite normal;} @keyframes sine { 0%{left:-110px; top:0%;} 1%{left:-101px; top:1%;} 2%{left:-91px; top:2%;} 3%{left:-81px; top:3%;} 4%{left:-72px; top:4%;} 5%{left:-63px; top:5%;} 6%{left:-54px; top:6%;} 7%{left:-46px; top:7%;} 8%{left:-39px; top:8%;} 9%{left:-32px; top:9%;} 10%{left:-26px; top:10%;} 11%{left:-21px; top:11%;} 12%{left:-17px; top:12%;} 13%{left:-14px; top:13%;} 14%{left:-12px; top:14%;} 15%{left:-11px; top:15%;} 16%{left:-11px; top:16%;} 17%{left:-11px; top:17%;} 18%{left:-13px; top:18%;} 19%{left:-16px; top:19%;} 20%{left:-20px; top:20%;} 21%{left:-24px; top:21%;} 22%{left:-30px; top:22%;} 23%{left:-36px; top:23%;} 24%{left:-43px; top:24%;} 25%{left:-51px; top:25%;} 26%{left:-59px; top:26%;} 27%{left:-68px; top:27%;} 28%{left:-77px; top:28%;} 29%{left:-87px; top:29%;} 30%{left:-96px; top:30%;} 31%{left:-106px; top:31%;} 32%{left:-116px; top:32%;} 33%{left:-126px; top:33%;} 34%{left:-136px; top:34%;} 35%{left:-146px; top:35%;} 36%{left:-155px; top:36%;} 37%{left:-163px; top:37%;} 38%{left:-172px; top:38%;} 39%{left:-179px; top:39%;} 40%{left:-186px; top:40%;} 41%{left:-192px; top:41%;} 42%{left:-198px; top:42%;} 43%{left:-202px; top:43%;} 44%{left:-206px; top:44%;} 45%{left:-208px; top:45%;} 46%{left:-210px; top:46%;} 47%{left:-210px; top:47%;} 48%{left:-210px; top:48%;} 49%{left:-209px; top:49%;} 50%{left:-206px; top:50%;} 51%{left:-203px; top:51%;} 52%{left:-199px; top:52%;} 53%{left:-194px; top:53%;} 54%{left:-188px; top:54%;} 55%{left:-181px; top:55%;} 56%{left:-174px; top:56%;} 57%{left:-166px; top:57%;} 58%{left:-157px; top:58%;} 59%{left:-148px; top:59%;} 60%{left:-138px; top:60%;} 61%{left:-129px; top:61%;} 62%{left:-119px; top:62%;} 63%{left:-109px; top:63%;} 64%{left:-99px; top:64%;} 65%{left:-89px; top:65%;} 66%{left:-79px; top:66%;} 67%{left:-70px; top:67%;} 68%{left:-61px; top:68%;} 69%{left:-53px; top:69%;} 70%{left:-45px; top:70%;} 71%{left:-38px; top:71%;} 72%{left:-31px; top:72%;} 73%{left:-25px; top:73%;} 74%{left:-21px; top:74%;} 75%{left:-17px; top:75%;} 76%{left:-14px; top:76%;} 77%{left:-12px; top:77%;} 78%{left:-11px; top:78%;} 79%{left:-11px; top:79%;} 80%{left:-12px; top:80%;} 81%{left:-14px; top:81%;} 82%{left:-16px; top:82%;} 83%{left:-20px; top:83%;} 84%{left:-25px; top:84%;} 85%{left:-31px; top:85%;} 86%{left:-37px; top:86%;} 87%{left:-44px; top:87%;} 88%{left:-52px; top:88%;} 89%{left:-60px; top:89%;} 90%{left:-69px; top:90%;} 91%{left:-79px; top:91%;} 92%{left:-88px; top:92%;} 93%{left:-98px; top:93%;} 94%{left:-108px; top:94%;} 95%{left:-118px; top:95%;} 96%{left:-128px; top:96%;} 97%{left:-138px; top:97%;} 98%{left:-147px; top:98%;} 99%{left:-156px; top:99%;} 100%{left:-165px; top:100%;} }</style><span style="left:110vw;"><div style="animation-delay:10.9s;"></div></span><span style="left:100vw;"><div style="animation-delay:5.2s;"></div></span><span style="left:90vw;"><div style="animation-delay:4.4s;"></div></span><span style="left:80vw;"><div style="animation-delay:3.2s;"></div></span><span style="left:70vw;"><div style="animation-delay:12.9s;"></div></span><span style="left:60vw;"><div style="animation-delay:3.8s;"></div></span><span style="left:50vw;"><div style="animation-delay:13.1s;"></div></span><span style="left:40vw;"><div style="animation-delay:18.5s;"></div></span><span style="left:30vw;"><div style="animation-delay:4.5s;"></div></span><span style="left:20vw;"><div style="animation-delay:3.6s;"></div></span><span style="left:10vw;"><div style="animation-delay:3.2s;"></div></span><span style="left:0vw;"><div style="animation-delay:15.2s;"></div></span><span style="left:-10vw;"><div style="animation-delay:17.6s;"></div></span></section>
Jellyfish
demo
clone
id: 2652524857
source: (triple click to highlight all)
<section id="snowflakes2652524857"><!--snowflakes(v1) generated with: https://snowfallgarden.lophius.xyz--><style>#snowflakes2652524857 { overflow:hidden; pointer-events:none; image-rendering:pixelated; } #snowflakes2652524857 > span { position:fixed; top:-60px; height:calc(100vh + 60px); } #snowflakes2652524857 span div { width:60px; height:60px; position:relative; background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAA8CAYAAAA6/NlyAAAAAXNSR0IArs4c6QAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAAAPKADAAQAAAABAAAAPAAAAACL3+lcAAAE3UlEQVRoBe2XXW4TQRCEAXEHHpA4Uk7CcTgJR0LigTsghXyEz6l05m/Xa1sRseTMTHd1ddXMenfz7t3b53XvwI9f9/cjBx96yVlhr+6W8deo+az9+u8Mn7Vbb8VvO/B8B/j9vIbf0Pvnss9bYfjLp/e7OOtm7eWZOdglbka6JZ9Gv/9+qrz7+DQ/0nzQPjW4xkyjmvz6uVwZPx9fIDAuFl3nmr+JYQ1gthr99s/oKf5vjVnNYxqOPeaveklrFPEjsxjz5MG2PmzIXtMtvovEEOgJthqYAyfWeeLBJTZzs/nVThjhrVOtAjVi3JtXvXzFka85a282elpbBWjKsdYTh7vGR+vuf0ujomvmMHW6gR3Q+CqGW5fc1pM5wOt+iq1ie5fkfgWPlXsu6eXncDWZ69YJaqaatS5riOXa2kuMS4YVWZ+N/rZWBPtblENOjKbZFa5LbMRfTprzradEssY00BMDPmuYy9+rIV55cy1fxkZc5KY3rd6zk9O1IUSc0ooBsNbV0yZuDhyfPP3HyPO/Ff88+3LVffGAaOWhng193bONYj0B1uLrhvmCYW2O8mTM+apO8WcblkgjrtNAGiXvxqQRhZP35MGxdsOY58d6a10nps6HN60VAgkVd1o7eRjdjIoBYo4N0ihxsObQ0TOdGOpmn6HhWfEsr5gZDnNfH0Dgc1PcBOK5+Zhnc1b5Z/1P+XMIa61rxHpaxHJ+avwwMZ4x56OcmN44vUv3Cs+J52nBg/E8WQyBIe5GndNvU+3ehrWOdT0ZMY4pLGM5F9OKmRuNFz3hFVF1ExBLLE+c+QrXyOim3N5m1FnLmOaMIyTnrhOrWHHmXJtfGZfv0pU8T6DXSAy1+VxOPOLrb5o8sZqTL3NwG0/em80R7YmkiNzAVh5sK25d5owl/1XnCOCboqqAFJlzcLnucfTitc9F1gjMbzZpCUtDzMFYb21iWhw1lng5LjJWoa0mM3GZbwnPPPx1bc9WrblDxlEDRTnS0M2pda11xuRwTPGJs0fmD53XZpAjqgoT51hFVDx5sOLNy+0ojzjrjB86ZpNKrCAwiq2Y2Vp+uSo+ecGKB5fzWneRNy2ek/w34/MxxVUBrGsewdQaz38brfdZzNo+5kZj1zDNbDgiyJx4BPuigTC+ict56zTSwKg2eVbny29aI0KNpric92qr2VxjGg64OWHGFc5eL+PdE4Z81ABBKVAssTwhG9XRWq4Ea8XIDSYvZzdW3J7xkBOmsQZmZhOXp0Y8a3PuKfcMyqmOrK01hxmGuNcoBYmpZqsw19Za5zrz5ojlXMxho80de8Q1n5cmuZpPnsRmvFc34qJ+0wlXsq27qfj8zcJReTXWi5OnDr67jTezqWGb0qBlkHwr3hOdZpNb/OqI2eRarRsanpkZNdEMmNGGjDh6ub1m4esaTsG9xjVea0ZGxfYw5H15qX1Yt0xT0+OTo2tYwNZx1LBegmBHIit+pmXU29oXLx6znbeQcSQ2ccw5kRpzbU/XjDPxrc1o8SQn8xeGCa4Ugmt9WrX18kuMxjLW4s1Yyyx5uRJb582X+myeJBlvNTCfNTb0hBFbNwCMteJbHOZ6Ixx76pp8kFVRLeAMM8u3OLfE1Nnrs+mmtbp7NlvFrxrKq6RXc3TPXp+rxDGs6as0fGvyCnfgDyA+12JV14FFAAAAAElFTkSuQmCC); animation: sine 15s linear 0s infinite normal;} @keyframes sine { 0%{left:-110px; top:0%;} 1%{left:-101px; top:1%;} 2%{left:-91px; top:2%;} 3%{left:-81px; top:3%;} 4%{left:-72px; top:4%;} 5%{left:-63px; top:5%;} 6%{left:-54px; top:6%;} 7%{left:-46px; top:7%;} 8%{left:-39px; top:8%;} 9%{left:-32px; top:9%;} 10%{left:-26px; top:10%;} 11%{left:-21px; top:11%;} 12%{left:-17px; top:12%;} 13%{left:-14px; top:13%;} 14%{left:-12px; top:14%;} 15%{left:-11px; top:15%;} 16%{left:-11px; top:16%;} 17%{left:-11px; top:17%;} 18%{left:-13px; top:18%;} 19%{left:-16px; top:19%;} 20%{left:-20px; top:20%;} 21%{left:-24px; top:21%;} 22%{left:-30px; top:22%;} 23%{left:-36px; top:23%;} 24%{left:-43px; top:24%;} 25%{left:-51px; top:25%;} 26%{left:-59px; top:26%;} 27%{left:-68px; top:27%;} 28%{left:-77px; top:28%;} 29%{left:-87px; top:29%;} 30%{left:-96px; top:30%;} 31%{left:-106px; top:31%;} 32%{left:-116px; top:32%;} 33%{left:-126px; top:33%;} 34%{left:-136px; top:34%;} 35%{left:-146px; top:35%;} 36%{left:-155px; top:36%;} 37%{left:-163px; top:37%;} 38%{left:-172px; top:38%;} 39%{left:-179px; top:39%;} 40%{left:-186px; top:40%;} 41%{left:-192px; top:41%;} 42%{left:-198px; top:42%;} 43%{left:-202px; top:43%;} 44%{left:-206px; top:44%;} 45%{left:-208px; top:45%;} 46%{left:-210px; top:46%;} 47%{left:-210px; top:47%;} 48%{left:-210px; top:48%;} 49%{left:-209px; top:49%;} 50%{left:-206px; top:50%;} 51%{left:-203px; top:51%;} 52%{left:-199px; top:52%;} 53%{left:-194px; top:53%;} 54%{left:-188px; top:54%;} 55%{left:-181px; top:55%;} 56%{left:-174px; top:56%;} 57%{left:-166px; top:57%;} 58%{left:-157px; top:58%;} 59%{left:-148px; top:59%;} 60%{left:-138px; top:60%;} 61%{left:-129px; top:61%;} 62%{left:-119px; top:62%;} 63%{left:-109px; top:63%;} 64%{left:-99px; top:64%;} 65%{left:-89px; top:65%;} 66%{left:-79px; top:66%;} 67%{left:-70px; top:67%;} 68%{left:-61px; top:68%;} 69%{left:-53px; top:69%;} 70%{left:-45px; top:70%;} 71%{left:-38px; top:71%;} 72%{left:-31px; top:72%;} 73%{left:-25px; top:73%;} 74%{left:-21px; top:74%;} 75%{left:-17px; top:75%;} 76%{left:-14px; top:76%;} 77%{left:-12px; top:77%;} 78%{left:-11px; top:78%;} 79%{left:-11px; top:79%;} 80%{left:-12px; top:80%;} 81%{left:-14px; top:81%;} 82%{left:-16px; top:82%;} 83%{left:-20px; top:83%;} 84%{left:-25px; top:84%;} 85%{left:-31px; top:85%;} 86%{left:-37px; top:86%;} 87%{left:-44px; top:87%;} 88%{left:-52px; top:88%;} 89%{left:-60px; top:89%;} 90%{left:-69px; top:90%;} 91%{left:-79px; top:91%;} 92%{left:-88px; top:92%;} 93%{left:-98px; top:93%;} 94%{left:-108px; top:94%;} 95%{left:-118px; top:95%;} 96%{left:-128px; top:96%;} 97%{left:-138px; top:97%;} 98%{left:-147px; top:98%;} 99%{left:-156px; top:99%;} 100%{left:-165px; top:100%;} }</style><span style="left:110vw;"><div style="animation-delay:6.6s;"></div></span><span style="left:100vw;"><div style="animation-delay:10.3s;"></div></span><span style="left:90vw;"><div style="animation-delay:5.6s;"></div></span><span style="left:80vw;"><div style="animation-delay:16.7s;"></div></span><span style="left:70vw;"><div style="animation-delay:7.7s;"></div></span><span style="left:60vw;"><div style="animation-delay:9.9s;"></div></span><span style="left:50vw;"><div style="animation-delay:5.2s;"></div></span><span style="left:40vw;"><div style="animation-delay:9.1s;"></div></span><span style="left:30vw;"><div style="animation-delay:14.3s;"></div></span><span style="left:20vw;"><div style="animation-delay:10.5s;"></div></span><span style="left:10vw;"><div style="animation-delay:6s;"></div></span><span style="left:0vw;"><div style="animation-delay:14.9s;"></div></span><span style="left:-10vw;"><div style="animation-delay:12.2s;"></div></span></section>
Valentine
demo
clone
id: 1004520608
source: (triple click to highlight all)
<section id="snowflakes1004520608"><!--snowflakes(v1) generated with: https://snowfallgarden.lophius.xyz--><style>#snowflakes1004520608 { overflow:hidden; pointer-events:none; image-rendering:pixelated; } #snowflakes1004520608 > span { position:fixed; top:-35px; height:calc(100vh + 35px); } #snowflakes1004520608 span div { width:35px; height:35px; position:relative; background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACMAAAAjCAYAAAAe2bNZAAAAAXNSR0IArs4c6QAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAAAI6ADAAQAAAABAAAAIwAAAAC4vEOnAAACu0lEQVRYCc2XbY7bMAxEnWCP0N7/gO0Zmvopfe6EphwF6I8K2CU1MxzS8sdit+1/W499MZMx5+uw5FfzzkfMeNcM4LYv9uQueSO4ufETLH3pl7VHc42NOZhYRvnEzLOBGNGajoc7hjH/sd1OV47Rt8ev7eftvn3fHuNq0M9MweHxsg6PuvACUz94TbtBEiP3hxqWZkYwNbV2NItf8vp8mUiEdqRMP+O4+tSz10/cWk9B3ChP3WEmmEViFIonJj6M9kE6Dk3i+iQuNoZJMaK6FItXffdcvKvRy4h+HCsPJqsagGXj5Cte99SyZviT/ctzQcd3RrKLDoGx5mLoxcjFZ1o0s/VymzSaicGzMXtqwIxgrk/80H5ZSNTUXC5NzetQaolqEku9fGKpHYMkOcspgpPvopgNcl/z3N/9LjitBjVmEZx6Ilzus7bWJZc+4/PgMBC+VSkid6WxQ8gZK+6Q8sT04S1y3flqsgC6QnCLk08MXE48/RIDd1nznOD25wMju0cFM4OQjhSdP5Xr9vraJzUvb5O3LG9XiskxwbAzU/uOR2cva9qYIq/Yq6HAfDVao5dNs49Y+wXuhBYYPSH3RBpenZjamf/xV1uhMQvyttVmDmC0ngjmPt8aXxg5Y3sykD7h5HUAMFY26/ZDtP+yPj3lMp6GyRMhr1fBAA5hEw3dp0YOn+otZzxuU9cYkQaY0YSGDqNJF9UR06NqZ32r7thTwAJwkNX4rDz/e3OYR3KcTGBtiimnA+kg5N6aGZ51aK7W6ZlRjIm5EYyVA8hl9NagTZy8w6pmeZ9meUIY5D51q+ZLt0ljb1PucwBPhOad9t1QL3+bZmKMHUBNh+33ZDxXnda6q7h0Mhpkk3rlaK4wPa7i0jAMkY26U8km8rUmNf88Z0gWxs/s/PZ80nTpZK4MHQaNJ3Glv+J+A2jXpA0ow9vsAAAAAElFTkSuQmCC); animation: sine 15s linear 0s infinite normal;} @keyframes sine { 0%{left:-110px; top:0%;} 1%{left:-101px; top:1%;} 2%{left:-91px; top:2%;} 3%{left:-81px; top:3%;} 4%{left:-72px; top:4%;} 5%{left:-63px; top:5%;} 6%{left:-54px; top:6%;} 7%{left:-46px; top:7%;} 8%{left:-39px; top:8%;} 9%{left:-32px; top:9%;} 10%{left:-26px; top:10%;} 11%{left:-21px; top:11%;} 12%{left:-17px; top:12%;} 13%{left:-14px; top:13%;} 14%{left:-12px; top:14%;} 15%{left:-11px; top:15%;} 16%{left:-11px; top:16%;} 17%{left:-11px; top:17%;} 18%{left:-13px; top:18%;} 19%{left:-16px; top:19%;} 20%{left:-20px; top:20%;} 21%{left:-24px; top:21%;} 22%{left:-30px; top:22%;} 23%{left:-36px; top:23%;} 24%{left:-43px; top:24%;} 25%{left:-51px; top:25%;} 26%{left:-59px; top:26%;} 27%{left:-68px; top:27%;} 28%{left:-77px; top:28%;} 29%{left:-87px; top:29%;} 30%{left:-96px; top:30%;} 31%{left:-106px; top:31%;} 32%{left:-116px; top:32%;} 33%{left:-126px; top:33%;} 34%{left:-136px; top:34%;} 35%{left:-146px; top:35%;} 36%{left:-155px; top:36%;} 37%{left:-163px; top:37%;} 38%{left:-172px; top:38%;} 39%{left:-179px; top:39%;} 40%{left:-186px; top:40%;} 41%{left:-192px; top:41%;} 42%{left:-198px; top:42%;} 43%{left:-202px; top:43%;} 44%{left:-206px; top:44%;} 45%{left:-208px; top:45%;} 46%{left:-210px; top:46%;} 47%{left:-210px; top:47%;} 48%{left:-210px; top:48%;} 49%{left:-209px; top:49%;} 50%{left:-206px; top:50%;} 51%{left:-203px; top:51%;} 52%{left:-199px; top:52%;} 53%{left:-194px; top:53%;} 54%{left:-188px; top:54%;} 55%{left:-181px; top:55%;} 56%{left:-174px; top:56%;} 57%{left:-166px; top:57%;} 58%{left:-157px; top:58%;} 59%{left:-148px; top:59%;} 60%{left:-138px; top:60%;} 61%{left:-129px; top:61%;} 62%{left:-119px; top:62%;} 63%{left:-109px; top:63%;} 64%{left:-99px; top:64%;} 65%{left:-89px; top:65%;} 66%{left:-79px; top:66%;} 67%{left:-70px; top:67%;} 68%{left:-61px; top:68%;} 69%{left:-53px; top:69%;} 70%{left:-45px; top:70%;} 71%{left:-38px; top:71%;} 72%{left:-31px; top:72%;} 73%{left:-25px; top:73%;} 74%{left:-21px; top:74%;} 75%{left:-17px; top:75%;} 76%{left:-14px; top:76%;} 77%{left:-12px; top:77%;} 78%{left:-11px; top:78%;} 79%{left:-11px; top:79%;} 80%{left:-12px; top:80%;} 81%{left:-14px; top:81%;} 82%{left:-16px; top:82%;} 83%{left:-20px; top:83%;} 84%{left:-25px; top:84%;} 85%{left:-31px; top:85%;} 86%{left:-37px; top:86%;} 87%{left:-44px; top:87%;} 88%{left:-52px; top:88%;} 89%{left:-60px; top:89%;} 90%{left:-69px; top:90%;} 91%{left:-79px; top:91%;} 92%{left:-88px; top:92%;} 93%{left:-98px; top:93%;} 94%{left:-108px; top:94%;} 95%{left:-118px; top:95%;} 96%{left:-128px; top:96%;} 97%{left:-138px; top:97%;} 98%{left:-147px; top:98%;} 99%{left:-156px; top:99%;} 100%{left:-165px; top:100%;} }</style><span style="left:110vw;"><div style="animation-delay:7.7s;"></div></span><span style="left:100vw;"><div style="animation-delay:7.4s;"></div></span><span style="left:90vw;"><div style="animation-delay:5.5s;"></div></span><span style="left:80vw;"><div style="animation-delay:7.2s;"></div></span><span style="left:70vw;"><div style="animation-delay:12.6s;"></div></span><span style="left:60vw;"><div style="animation-delay:3.7s;"></div></span><span style="left:50vw;"><div style="animation-delay:16.4s;"></div></span><span style="left:40vw;"><div style="animation-delay:7.7s;"></div></span><span style="left:30vw;"><div style="animation-delay:16.6s;"></div></span><span style="left:20vw;"><div style="animation-delay:8.9s;"></div></span><span style="left:10vw;"><div style="animation-delay:15.2s;"></div></span><span style="left:0vw;"><div style="animation-delay:2.4s;"></div></span><span style="left:-10vw;"><div style="animation-delay:5.9s;"></div></span></section>
n
demo
clone
id: 4110698613
source: (triple click to highlight all)
<section id="snowflakes4110698613"><!--snowflakes(v1) generated with: https://snowfallgarden.lophius.xyz--><style>#snowflakes4110698613 { overflow:hidden; pointer-events:none; image-rendering:pixelated; } #snowflakes4110698613 > span { position:fixed; top:-35px; height:calc(100vh + 35px); } #snowflakes4110698613 span div { width:35px; height:35px; position:relative; background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACMAAAAjCAYAAAAe2bNZAAAAAXNSR0IArs4c6QAAA3xJREFUWEelWFuS7SAIlNz9L3niLZ42iEmm5nydROVNN4aG/eack+iiMaa88ec573hP/F5W9R+vjUmDLqJ5z8mviYgXtx+vyz7RQ2QiRM9FRCxXFlmwGjKGH3KDXOpRCZ8XSWO40GqJ6tCfywmjzHGWsbxgr8SsxisTVgWJEjMEld3mLb/j/6wEnVkRzrrakIaJZhl6Vr2rpqPBuHZJitabziBNjWlzy/jMPyJir6KmJKdWLl30mqW03R7Y2OqcOxgLuSZozPmTstgVpQvx/HdKunOhy8Lj5yJNWFCrm9gL6ybuM+4Yj1WfYNUNIXHF97znRVfbTb4nifT27Kueo8WtvOeDhXmhpkhwbC9t9a17orsWnGz+vYW65hzTW1v4VRYbikUd+TKwOgoALMHC/maMHq4Zzp0nmGlpboDJw9sVoWcrUNtr6lTpBWscbNlIl3FIk6rylJzaEYFuRXRFQYtF6wbpBc85LUidVkeQO6Sgj2FZlcxBRUrKNZ6fnJeEdgqPPRYwixG+YUiHYvMo+PpKtRJnIkxLXxfdim1mjKEPH/xR9hVFyQDFm7cO0dZnBKDlCESgI81Im/wxk2paOqYOYQnY2MiCQYAxmOnQ4WGAcWLrJhwDXqNgHfJKB2H4GlWwU72OAh0VdRcaYugQV4KPtmFKETrqzNZT5zTNgDgXNTPve5vU/hyZjTo+RMYNrvxyrpm9XZ3XODSee+elVDNlXKlDV9QwdyUWcYX6vT0fBpxST53DO84oLAwdDnnIzkAnBtgw/RvqqEN3izPXxYWmYs2OVFY71T97L4cPWwCjBXdwFq7zUyAMzqPdGPCNmxb61qbpOK6id+KmjkUFiU/8ZBqDJg57MWgVw5xS/Zq0zcDIOzKBGNcgXmDX1dqIfXaxazNoL+tNwss3IpsLeBf1ZdJDgm1Zv0bVnysGVMQ8za54jsNfUdrXNTWKzisSt6GRgeDiaT223Q7uOZm1ear3nFZQ/NBn+TprqcPbgMg0Vj/cm9S4FLXD/e3rNIiy0BhWIoxvrR+KVbsiwmM7fwnJAX/WtWanlPg0kS23DwAWm9ph8cXCvmCk7wdwy0B1dapbSKm3gq/+ReR8xHiaXzBtXosCaOWOlLtMzWlxJoZmG0FFWDProDLdc/hQZDWBe7YuxZt96qYYoi/iOacbBdyQiilng7Rrtq6FbvoPIFNbOiMXIscAAAAASUVORK5CYII=); animation: sine 15s linear 0s infinite normal;} @keyframes sine { 0%{left:-110px; top:0%;} 1%{left:-101px; top:1%;} 2%{left:-91px; top:2%;} 3%{left:-81px; top:3%;} 4%{left:-72px; top:4%;} 5%{left:-63px; top:5%;} 6%{left:-54px; top:6%;} 7%{left:-46px; top:7%;} 8%{left:-39px; top:8%;} 9%{left:-32px; top:9%;} 10%{left:-26px; top:10%;} 11%{left:-21px; top:11%;} 12%{left:-17px; top:12%;} 13%{left:-14px; top:13%;} 14%{left:-12px; top:14%;} 15%{left:-11px; top:15%;} 16%{left:-11px; top:16%;} 17%{left:-11px; top:17%;} 18%{left:-13px; top:18%;} 19%{left:-16px; top:19%;} 20%{left:-20px; top:20%;} 21%{left:-24px; top:21%;} 22%{left:-30px; top:22%;} 23%{left:-36px; top:23%;} 24%{left:-43px; top:24%;} 25%{left:-51px; top:25%;} 26%{left:-59px; top:26%;} 27%{left:-68px; top:27%;} 28%{left:-77px; top:28%;} 29%{left:-87px; top:29%;} 30%{left:-96px; top:30%;} 31%{left:-106px; top:31%;} 32%{left:-116px; top:32%;} 33%{left:-126px; top:33%;} 34%{left:-136px; top:34%;} 35%{left:-146px; top:35%;} 36%{left:-155px; top:36%;} 37%{left:-163px; top:37%;} 38%{left:-172px; top:38%;} 39%{left:-179px; top:39%;} 40%{left:-186px; top:40%;} 41%{left:-192px; top:41%;} 42%{left:-198px; top:42%;} 43%{left:-202px; top:43%;} 44%{left:-206px; top:44%;} 45%{left:-208px; top:45%;} 46%{left:-210px; top:46%;} 47%{left:-210px; top:47%;} 48%{left:-210px; top:48%;} 49%{left:-209px; top:49%;} 50%{left:-206px; top:50%;} 51%{left:-203px; top:51%;} 52%{left:-199px; top:52%;} 53%{left:-194px; top:53%;} 54%{left:-188px; top:54%;} 55%{left:-181px; top:55%;} 56%{left:-174px; top:56%;} 57%{left:-166px; top:57%;} 58%{left:-157px; top:58%;} 59%{left:-148px; top:59%;} 60%{left:-138px; top:60%;} 61%{left:-129px; top:61%;} 62%{left:-119px; top:62%;} 63%{left:-109px; top:63%;} 64%{left:-99px; top:64%;} 65%{left:-89px; top:65%;} 66%{left:-79px; top:66%;} 67%{left:-70px; top:67%;} 68%{left:-61px; top:68%;} 69%{left:-53px; top:69%;} 70%{left:-45px; top:70%;} 71%{left:-38px; top:71%;} 72%{left:-31px; top:72%;} 73%{left:-25px; top:73%;} 74%{left:-21px; top:74%;} 75%{left:-17px; top:75%;} 76%{left:-14px; top:76%;} 77%{left:-12px; top:77%;} 78%{left:-11px; top:78%;} 79%{left:-11px; top:79%;} 80%{left:-12px; top:80%;} 81%{left:-14px; top:81%;} 82%{left:-16px; top:82%;} 83%{left:-20px; top:83%;} 84%{left:-25px; top:84%;} 85%{left:-31px; top:85%;} 86%{left:-37px; top:86%;} 87%{left:-44px; top:87%;} 88%{left:-52px; top:88%;} 89%{left:-60px; top:89%;} 90%{left:-69px; top:90%;} 91%{left:-79px; top:91%;} 92%{left:-88px; top:92%;} 93%{left:-98px; top:93%;} 94%{left:-108px; top:94%;} 95%{left:-118px; top:95%;} 96%{left:-128px; top:96%;} 97%{left:-138px; top:97%;} 98%{left:-147px; top:98%;} 99%{left:-156px; top:99%;} 100%{left:-165px; top:100%;} }</style><span style="left:110vw;"><div style="animation-delay:6.6s;"></div></span><span style="left:100vw;"><div style="animation-delay:18.8s;"></div></span><span style="left:90vw;"><div style="animation-delay:19.5s;"></div></span><span style="left:80vw;"><div style="animation-delay:5.2s;"></div></span><span style="left:70vw;"><div style="animation-delay:19.5s;"></div></span><span style="left:60vw;"><div style="animation-delay:14.1s;"></div></span><span style="left:50vw;"><div style="animation-delay:19.4s;"></div></span><span style="left:40vw;"><div style="animation-delay:6.7s;"></div></span><span style="left:30vw;"><div style="animation-delay:8.5s;"></div></span><span style="left:20vw;"><div style="animation-delay:7.3s;"></div></span><span style="left:10vw;"><div style="animation-delay:6.7s;"></div></span><span style="left:0vw;"><div style="animation-delay:1.5s;"></div></span><span style="left:-10vw;"><div style="animation-delay:14.2s;"></div></span></section>
cyn
demo
clone
id: 3351231074
source: (triple click to highlight all)
<section id="snowflakes3351231074"><!--snowflakes(v1) generated with: https://snowfallgarden.lophius.xyz--><style>#snowflakes3351231074 { overflow:hidden; pointer-events:none; image-rendering:pixelated; } #snowflakes3351231074 > span { position:fixed; top:-35px; height:calc(100vh + 35px); } #snowflakes3351231074 span div { width:35px; height:35px; position:relative; background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACMAAAAjCAYAAAAe2bNZAAABgklEQVRYR81YsQ0CMQzkB6FiCzp2QKJjBUoYAUpWoENiBzq2oGKQRwFZujd2fP4vCBWIi32+XOz8d7Pgs3md+gK5zvddhPX+Z2NQCSQYJquRy+IlLkWmgDEBo1IWX3LQZIR9ScKSYXCodprMeXXrd/d1uI7FtU1GG86St1RaqmBUkWpra6ycH7nRB/i9P8z67vj1lRdYMIj1yCDGyjkgw1TPeiHCYS4hNjBiFKCmEBqRKUpi4banyVhBdOdlihpNpuz1pymBf2pGRjJ6rVbQVYap2toqxuiMej/NK7Pf+qhPWeuOg1pQTwW9xjrq0QEw23o5asvtYqCs5REhgEAG97g8zSuJSwa7sJVUeyD6jSS9YRsOvCgJa3omTvvKNOWZZk7TlF4xZa3ZZ5i5UuspGUK6DVCD8i+ziVGFOcpj41DKZO8qY7eqvZtec3dg3Iq/Ph0wcwNv/MzjCmtizJ0elGwSFjeJTBPP2tm3Clm8e+3UHsq+b8niJV/oGfatU+0QsDHe8ZgQQmEuIjwAAAAASUVORK5CYII=); animation: sine 15s linear 0s infinite normal;} @keyframes sine { 0%{left:-110px; top:0%;} 1%{left:-101px; top:1%;} 2%{left:-91px; top:2%;} 3%{left:-81px; top:3%;} 4%{left:-72px; top:4%;} 5%{left:-63px; top:5%;} 6%{left:-54px; top:6%;} 7%{left:-46px; top:7%;} 8%{left:-39px; top:8%;} 9%{left:-32px; top:9%;} 10%{left:-26px; top:10%;} 11%{left:-21px; top:11%;} 12%{left:-17px; top:12%;} 13%{left:-14px; top:13%;} 14%{left:-12px; top:14%;} 15%{left:-11px; top:15%;} 16%{left:-11px; top:16%;} 17%{left:-11px; top:17%;} 18%{left:-13px; top:18%;} 19%{left:-16px; top:19%;} 20%{left:-20px; top:20%;} 21%{left:-24px; top:21%;} 22%{left:-30px; top:22%;} 23%{left:-36px; top:23%;} 24%{left:-43px; top:24%;} 25%{left:-51px; top:25%;} 26%{left:-59px; top:26%;} 27%{left:-68px; top:27%;} 28%{left:-77px; top:28%;} 29%{left:-87px; top:29%;} 30%{left:-96px; top:30%;} 31%{left:-106px; top:31%;} 32%{left:-116px; top:32%;} 33%{left:-126px; top:33%;} 34%{left:-136px; top:34%;} 35%{left:-146px; top:35%;} 36%{left:-155px; top:36%;} 37%{left:-163px; top:37%;} 38%{left:-172px; top:38%;} 39%{left:-179px; top:39%;} 40%{left:-186px; top:40%;} 41%{left:-192px; top:41%;} 42%{left:-198px; top:42%;} 43%{left:-202px; top:43%;} 44%{left:-206px; top:44%;} 45%{left:-208px; top:45%;} 46%{left:-210px; top:46%;} 47%{left:-210px; top:47%;} 48%{left:-210px; top:48%;} 49%{left:-209px; top:49%;} 50%{left:-206px; top:50%;} 51%{left:-203px; top:51%;} 52%{left:-199px; top:52%;} 53%{left:-194px; top:53%;} 54%{left:-188px; top:54%;} 55%{left:-181px; top:55%;} 56%{left:-174px; top:56%;} 57%{left:-166px; top:57%;} 58%{left:-157px; top:58%;} 59%{left:-148px; top:59%;} 60%{left:-138px; top:60%;} 61%{left:-129px; top:61%;} 62%{left:-119px; top:62%;} 63%{left:-109px; top:63%;} 64%{left:-99px; top:64%;} 65%{left:-89px; top:65%;} 66%{left:-79px; top:66%;} 67%{left:-70px; top:67%;} 68%{left:-61px; top:68%;} 69%{left:-53px; top:69%;} 70%{left:-45px; top:70%;} 71%{left:-38px; top:71%;} 72%{left:-31px; top:72%;} 73%{left:-25px; top:73%;} 74%{left:-21px; top:74%;} 75%{left:-17px; top:75%;} 76%{left:-14px; top:76%;} 77%{left:-12px; top:77%;} 78%{left:-11px; top:78%;} 79%{left:-11px; top:79%;} 80%{left:-12px; top:80%;} 81%{left:-14px; top:81%;} 82%{left:-16px; top:82%;} 83%{left:-20px; top:83%;} 84%{left:-25px; top:84%;} 85%{left:-31px; top:85%;} 86%{left:-37px; top:86%;} 87%{left:-44px; top:87%;} 88%{left:-52px; top:88%;} 89%{left:-60px; top:89%;} 90%{left:-69px; top:90%;} 91%{left:-79px; top:91%;} 92%{left:-88px; top:92%;} 93%{left:-98px; top:93%;} 94%{left:-108px; top:94%;} 95%{left:-118px; top:95%;} 96%{left:-128px; top:96%;} 97%{left:-138px; top:97%;} 98%{left:-147px; top:98%;} 99%{left:-156px; top:99%;} 100%{left:-165px; top:100%;} }</style><span style="left:110vw;"><div style="animation-delay:0.3s;"></div></span><span style="left:100vw;"><div style="animation-delay:8.7s;"></div></span><span style="left:90vw;"><div style="animation-delay:7.8s;"></div></span><span style="left:80vw;"><div style="animation-delay:9.9s;"></div></span><span style="left:70vw;"><div style="animation-delay:2.1s;"></div></span><span style="left:60vw;"><div style="animation-delay:9.8s;"></div></span><span style="left:50vw;"><div style="animation-delay:2.7s;"></div></span><span style="left:40vw;"><div style="animation-delay:9.2s;"></div></span><span style="left:30vw;"><div style="animation-delay:0.5s;"></div></span><span style="left:20vw;"><div style="animation-delay:9.1s;"></div></span><span style="left:10vw;"><div style="animation-delay:10.7s;"></div></span><span style="left:0vw;"><div style="animation-delay:3.9s;"></div></span><span style="left:-10vw;"><div style="animation-delay:12.8s;"></div></span></section>
Pixel
demo
clone
id: 4139009912
source: (triple click to highlight all)
<section id="snowflakes4139009912"><!--snowflakes(v1) generated with: https://snowfallgarden.lophius.xyz--><style>#snowflakes4139009912 { overflow:hidden; pointer-events:none; image-rendering:pixelated; } #snowflakes4139009912 > span { position:fixed; top:-35px; height:calc(100vh + 35px); } #snowflakes4139009912 span div { width:35px; height:35px; position:relative; background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACMAAAAjCAYAAAAe2bNZAAAAAXNSR0IArs4c6QAABUBJREFUWEeFWG1WI0cMlHwobN6yxwg27AkW5ziLcwOwyTEgD8OeKe68Kn20euwh84fx0NMtlUolaVTKtTzctY/1s+JR08embcv7fuFny59NHptKXzP8zqWX38HTK5y3edbYUmNp/jOMKQeFRTSj/IDBxTYaWY0bHbFf5uSfCqeq831rFVnuOypTZFprTVUVa0SbfKz3io3iMKA59xtrWzs11QUNmKJZDcow0BhA5hdewu3q8OahUTnePgmMqsDHZlMv6dCptdXf9wnQcX3DvVSAjF35nnbQJ4jacTDwfXMjFlRlCHCALlTD2AjN2e8L6+BYcPJSCBPeuuiil46UEVhleXgVbSpmbHj5xntDoGNsSHQ8p/tHiAdj5uPeORGhumRwhR08W71YiOAoMgf3n34fDlS+DcQLX+zATrjuY4TLswaURDhU1Ui+UIT0RBRtbb0i00Do1csPy66yyo0ZX4T1p9aa6G5COPCmyb9I+/aQW9GYE9b70boT1a3rh4WHnMLt6ScdZRQm9vL1gLxCi7h3zejxplDdPgkMjf/X7OKh7UEQosrDWAPUQGRyy7MzzjdjqB8WWxhUD6owV2PhFI0CzB4m3AdPcM/DLHLDZQYXhJxXNObqsGkIQDWmpiEN9IuHNZEjs2jrXAnOWMqbNpkxcYVRQOEd2dYeZAEhdWLj7CFM+EempUOdHqbYjbVm9PnyryH8HmKi6LqTYQrLPjfPerW/a/S4bU3UVGS1716yJFSD8+zzzImDBkM231CcDFFH8Cy1UQbAG8KqO1pMhNpPEf2LR/LZxCuE62OzZ82JRCCSIXpE906O6+9mNjKQ+7/as0J0OFlihuK3YZgWslWwfhms98wKVIIT2N9aAEt5ChsUhslwI3j/E4VSfnUe5f549g95mgqcHhWkYVCiE8Tdv/Hg1Isqa0mjMVwIhznoyATCvn9lGPYeJDLiy6ySX222jpZdIG6tPbaFbvXUHpl2uekM11GraKTrTGZcjXU8BDKAGFBnSh9e2cf06nxO2mkuARmK5LCP8RHI9x2sR8pyACKSxOtv7DfQkWUmfcUZ7wwBB8XTxf9j812We3DGQjvl33w2OYkym/ZvFDWwvVH2Z7LJlTMQAQqUeU/hyJaaXbLYUS4iW5cvP2jwJJs8vUNZvX+BR8yaUkew0f8FKXQGBff6cE8ihVHBM6R4bWFTgZGCKAvxQoMGHO4FFH+/faJ01wZpVnnPSKtiLcM9HYgiC22qqU3OWNe2Yawv1ibvWVy1JPqQ1CPvY6zp/qI2uTOhZQihKTrOtrroyPQHtWpPnWTqH+48d61BhxdALYppVO1AYdrAk+AYcU5hjJH+rFDWOoLKCiXu4fAmHbVp0s/kGhYGO4j9TBnQIsRQ9utS1aPegcSl7TQdRzr8jk5vsWPZmQ5m0UClWBVk+GyxY7GtvEp9yvD0ucvqlkg3JtIDvcra5iNbY/PTuLEkajHgxd+5d/C898C9WQ9DkG00BqehhaBouVG1gNX74x/WvZ1NB06waQvLvakjxsuYDsI5ti7P1ml+PTcF0CyKI0LQCGxeZ6Ts8EL+1UI/DfPs3HRRL4qXKXCwHE2Xz90gYg4D3iwlh2o7Woa/0JU5jfL9TGuim+dEMcza9vpYZXt2xZD2m4U0KKZyaqd27YMcnlvBHJEiSp51yfg6gLNBKp9E8itEaZ6tITKCjV8h6lcKux/IXT6JwEE717rFRGb6veTyhx8H2MMYoRqmwqpNF/qZui8KKwgdGjRoQSUWX+JUOD8NfPnlaoYYaNrik4hRA6jY9R/xP5lzwHsPEgAAAABJRU5ErkJggg==); animation: sine 15s linear 0s infinite normal;} @keyframes sine { 0%{left:-110px; top:0%;} 1%{left:-101px; top:1%;} 2%{left:-91px; top:2%;} 3%{left:-81px; top:3%;} 4%{left:-72px; top:4%;} 5%{left:-63px; top:5%;} 6%{left:-54px; top:6%;} 7%{left:-46px; top:7%;} 8%{left:-39px; top:8%;} 9%{left:-32px; top:9%;} 10%{left:-26px; top:10%;} 11%{left:-21px; top:11%;} 12%{left:-17px; top:12%;} 13%{left:-14px; top:13%;} 14%{left:-12px; top:14%;} 15%{left:-11px; top:15%;} 16%{left:-11px; top:16%;} 17%{left:-11px; top:17%;} 18%{left:-13px; top:18%;} 19%{left:-16px; top:19%;} 20%{left:-20px; top:20%;} 21%{left:-24px; top:21%;} 22%{left:-30px; top:22%;} 23%{left:-36px; top:23%;} 24%{left:-43px; top:24%;} 25%{left:-51px; top:25%;} 26%{left:-59px; top:26%;} 27%{left:-68px; top:27%;} 28%{left:-77px; top:28%;} 29%{left:-87px; top:29%;} 30%{left:-96px; top:30%;} 31%{left:-106px; top:31%;} 32%{left:-116px; top:32%;} 33%{left:-126px; top:33%;} 34%{left:-136px; top:34%;} 35%{left:-146px; top:35%;} 36%{left:-155px; top:36%;} 37%{left:-163px; top:37%;} 38%{left:-172px; top:38%;} 39%{left:-179px; top:39%;} 40%{left:-186px; top:40%;} 41%{left:-192px; top:41%;} 42%{left:-198px; top:42%;} 43%{left:-202px; top:43%;} 44%{left:-206px; top:44%;} 45%{left:-208px; top:45%;} 46%{left:-210px; top:46%;} 47%{left:-210px; top:47%;} 48%{left:-210px; top:48%;} 49%{left:-209px; top:49%;} 50%{left:-206px; top:50%;} 51%{left:-203px; top:51%;} 52%{left:-199px; top:52%;} 53%{left:-194px; top:53%;} 54%{left:-188px; top:54%;} 55%{left:-181px; top:55%;} 56%{left:-174px; top:56%;} 57%{left:-166px; top:57%;} 58%{left:-157px; top:58%;} 59%{left:-148px; top:59%;} 60%{left:-138px; top:60%;} 61%{left:-129px; top:61%;} 62%{left:-119px; top:62%;} 63%{left:-109px; top:63%;} 64%{left:-99px; top:64%;} 65%{left:-89px; top:65%;} 66%{left:-79px; top:66%;} 67%{left:-70px; top:67%;} 68%{left:-61px; top:68%;} 69%{left:-53px; top:69%;} 70%{left:-45px; top:70%;} 71%{left:-38px; top:71%;} 72%{left:-31px; top:72%;} 73%{left:-25px; top:73%;} 74%{left:-21px; top:74%;} 75%{left:-17px; top:75%;} 76%{left:-14px; top:76%;} 77%{left:-12px; top:77%;} 78%{left:-11px; top:78%;} 79%{left:-11px; top:79%;} 80%{left:-12px; top:80%;} 81%{left:-14px; top:81%;} 82%{left:-16px; top:82%;} 83%{left:-20px; top:83%;} 84%{left:-25px; top:84%;} 85%{left:-31px; top:85%;} 86%{left:-37px; top:86%;} 87%{left:-44px; top:87%;} 88%{left:-52px; top:88%;} 89%{left:-60px; top:89%;} 90%{left:-69px; top:90%;} 91%{left:-79px; top:91%;} 92%{left:-88px; top:92%;} 93%{left:-98px; top:93%;} 94%{left:-108px; top:94%;} 95%{left:-118px; top:95%;} 96%{left:-128px; top:96%;} 97%{left:-138px; top:97%;} 98%{left:-147px; top:98%;} 99%{left:-156px; top:99%;} 100%{left:-165px; top:100%;} }</style><span style="left:110vw;"><div style="animation-delay:6.1s;"></div></span><span style="left:100vw;"><div style="animation-delay:9.3s;"></div></span><span style="left:90vw;"><div style="animation-delay:9.7s;"></div></span><span style="left:80vw;"><div style="animation-delay:6.9s;"></div></span><span style="left:70vw;"><div style="animation-delay:9.8s;"></div></span><span style="left:60vw;"><div style="animation-delay:2.4s;"></div></span><span style="left:50vw;"><div style="animation-delay:9.2s;"></div></span><span style="left:40vw;"><div style="animation-delay:3.5s;"></div></span><span style="left:30vw;"><div style="animation-delay:2.2s;"></div></span><span style="left:20vw;"><div style="animation-delay:12.9s;"></div></span><span style="left:10vw;"><div style="animation-delay:17.5s;"></div></span><span style="left:0vw;"><div style="animation-delay:0.1s;"></div></span><span style="left:-10vw;"><div style="animation-delay:8.3s;"></div></span></section>
FrogBear
demo
clone
id: 3470869968
source: (triple click to highlight all)
<section id="snowflakes3470869968"><!--snowflakes(v1) generated with: https://snowfallgarden.lophius.xyz--><style>#snowflakes3470869968 { overflow:hidden; pointer-events:none; image-rendering:pixelated; } #snowflakes3470869968 > span { position:fixed; top:-35px; height:calc(100vh + 35px); } #snowflakes3470869968 span div { width:35px; height:35px; position:relative; background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACMAAAAjCAYAAAAe2bNZAAABo0lEQVRYR9VYQZLDMAhr/v/ots6UjKxKgDM9uLnt2sYChMA9HuZ7vr/j/bn1+H/sW92v7F6XDWNjwwCAF8ShDrDMMbTD9sP25Dl6x552PWdAmR1eu6JQpYuBVukLb7tpPPcpoy4KmMpxji9SgFV6nf2JMxUvGAyTGB1ze7M0tqslIlGlh9c5Xdn5FEx4J8vwU3Xq8uqcA3QbTFaqqfeJdlkCs764akKeYURUetQ6Av8CwyEOEURB7PKmOssF8yV6HH4FAi/p8CkDhYBO0ctIiOEOYFjSrnqw+pQNea9KCwpaph13RC9T8jNNTCwlWG5PJ42K5Jzq8fcExlWGqyzXBKs+5sBNnGF2q2iwA47AmOqspKc1RTTHGSSuqyichxRQFc1I9f9Epmp6P+fMVtW0lc5spcBKYVnIlEBVM0smpK7U9+3aqgGuzCU/n2dc2twMgyKXpY5bilTubFBa4YWag7JWsQyG20LH80ooM+f3fzexzDOx3dNVjQ5LL0p3serQnfGhO/twuk4cXD3uBViBdlxwzVSNKfv+PuOiVJV/NVB17b4Ad39EMcjN7l8AAAAASUVORK5CYII=); animation: sine 15s linear 0s infinite normal;} @keyframes sine { 0%{left:-110px; top:0%;} 1%{left:-101px; top:1%;} 2%{left:-91px; top:2%;} 3%{left:-81px; top:3%;} 4%{left:-72px; top:4%;} 5%{left:-63px; top:5%;} 6%{left:-54px; top:6%;} 7%{left:-46px; top:7%;} 8%{left:-39px; top:8%;} 9%{left:-32px; top:9%;} 10%{left:-26px; top:10%;} 11%{left:-21px; top:11%;} 12%{left:-17px; top:12%;} 13%{left:-14px; top:13%;} 14%{left:-12px; top:14%;} 15%{left:-11px; top:15%;} 16%{left:-11px; top:16%;} 17%{left:-11px; top:17%;} 18%{left:-13px; top:18%;} 19%{left:-16px; top:19%;} 20%{left:-20px; top:20%;} 21%{left:-24px; top:21%;} 22%{left:-30px; top:22%;} 23%{left:-36px; top:23%;} 24%{left:-43px; top:24%;} 25%{left:-51px; top:25%;} 26%{left:-59px; top:26%;} 27%{left:-68px; top:27%;} 28%{left:-77px; top:28%;} 29%{left:-87px; top:29%;} 30%{left:-96px; top:30%;} 31%{left:-106px; top:31%;} 32%{left:-116px; top:32%;} 33%{left:-126px; top:33%;} 34%{left:-136px; top:34%;} 35%{left:-146px; top:35%;} 36%{left:-155px; top:36%;} 37%{left:-163px; top:37%;} 38%{left:-172px; top:38%;} 39%{left:-179px; top:39%;} 40%{left:-186px; top:40%;} 41%{left:-192px; top:41%;} 42%{left:-198px; top:42%;} 43%{left:-202px; top:43%;} 44%{left:-206px; top:44%;} 45%{left:-208px; top:45%;} 46%{left:-210px; top:46%;} 47%{left:-210px; top:47%;} 48%{left:-210px; top:48%;} 49%{left:-209px; top:49%;} 50%{left:-206px; top:50%;} 51%{left:-203px; top:51%;} 52%{left:-199px; top:52%;} 53%{left:-194px; top:53%;} 54%{left:-188px; top:54%;} 55%{left:-181px; top:55%;} 56%{left:-174px; top:56%;} 57%{left:-166px; top:57%;} 58%{left:-157px; top:58%;} 59%{left:-148px; top:59%;} 60%{left:-138px; top:60%;} 61%{left:-129px; top:61%;} 62%{left:-119px; top:62%;} 63%{left:-109px; top:63%;} 64%{left:-99px; top:64%;} 65%{left:-89px; top:65%;} 66%{left:-79px; top:66%;} 67%{left:-70px; top:67%;} 68%{left:-61px; top:68%;} 69%{left:-53px; top:69%;} 70%{left:-45px; top:70%;} 71%{left:-38px; top:71%;} 72%{left:-31px; top:72%;} 73%{left:-25px; top:73%;} 74%{left:-21px; top:74%;} 75%{left:-17px; top:75%;} 76%{left:-14px; top:76%;} 77%{left:-12px; top:77%;} 78%{left:-11px; top:78%;} 79%{left:-11px; top:79%;} 80%{left:-12px; top:80%;} 81%{left:-14px; top:81%;} 82%{left:-16px; top:82%;} 83%{left:-20px; top:83%;} 84%{left:-25px; top:84%;} 85%{left:-31px; top:85%;} 86%{left:-37px; top:86%;} 87%{left:-44px; top:87%;} 88%{left:-52px; top:88%;} 89%{left:-60px; top:89%;} 90%{left:-69px; top:90%;} 91%{left:-79px; top:91%;} 92%{left:-88px; top:92%;} 93%{left:-98px; top:93%;} 94%{left:-108px; top:94%;} 95%{left:-118px; top:95%;} 96%{left:-128px; top:96%;} 97%{left:-138px; top:97%;} 98%{left:-147px; top:98%;} 99%{left:-156px; top:99%;} 100%{left:-165px; top:100%;} }</style><span style="left:110vw;"><div style="animation-delay:0.8s;"></div></span><span style="left:100vw;"><div style="animation-delay:15.1s;"></div></span><span style="left:90vw;"><div style="animation-delay:1.7s;"></div></span><span style="left:80vw;"><div style="animation-delay:5.3s;"></div></span><span style="left:70vw;"><div style="animation-delay:1.6s;"></div></span><span style="left:60vw;"><div style="animation-delay:12s;"></div></span><span style="left:50vw;"><div style="animation-delay:13.4s;"></div></span><span style="left:40vw;"><div style="animation-delay:12.9s;"></div></span><span style="left:30vw;"><div style="animation-delay:8.9s;"></div></span><span style="left:20vw;"><div style="animation-delay:14s;"></div></span><span style="left:10vw;"><div style="animation-delay:16.8s;"></div></span><span style="left:0vw;"><div style="animation-delay:8.2s;"></div></span><span style="left:-10vw;"><div style="animation-delay:12.7s;"></div></span></section>
ovthr
demo
clone
id: 3535680361
source: (triple click to highlight all)
<section id="snowflakes3535680361"><!--snowflakes(v1) generated with: https://snowfallgarden.lophius.xyz--><style>#snowflakes3535680361 { overflow:hidden; pointer-events:none; image-rendering:pixelated; } #snowflakes3535680361 > span { position:fixed; top:-35px; height:calc(100vh + 35px); } #snowflakes3535680361 span div { width:35px; height:35px; position:relative; background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACMAAAAjCAYAAAAe2bNZAAAAAXNSR0IArs4c6QAAAY1JREFUWEftlcFKAlEUhv/TuAicUEF6h6JFZQW2auEqSJDW2iPUIgiCTFz0HukyKrBlha4KLMIWtZgXCCLUIYVaTCdGMmcs4V5tYhbXpZw55+P//3MuwUc/8hELFMwgN5QyShnZTVWZ+fPMmK+ZPIhmfzRmroUmCllZi+x6aZua7fQCmCpgjAPQfhlqgfAG4pVwsHgrAyUF0wH5oBvhAWO8KAMkB9PKtMAICsMQ2mG9oIvWC8PYGWFgt2tNLnuHvf05aFqvxXrqAsenCedsi4AD0QyJw7Q2Ssy81p2USp7j6CSBQKDXIhop4qWRdglBRGch/TApoo6CGfnOmH02PT40MDUdATm0vb56Rnx58v9sYgYsiwdGwIZzhtqbzHxtk2GY2s52FbX7Ohr19z4VgM2tGeTy893/vdkmu3vTcWfsbSqXn1ww9ma5tsmrO9OBcVxgwzARXyq5LLusrCIWi/YAvbzA30B+eJucnvji1Ra5pMPWCF/gYQfIfKdgRn4OZOQetlbZpGySzY6vMvMJLo6wJMwBxF0AAAAASUVORK5CYII=); animation: sine 15s linear 0s infinite normal;} @keyframes sine { 0%{left:-110px; top:0%;} 1%{left:-101px; top:1%;} 2%{left:-91px; top:2%;} 3%{left:-81px; top:3%;} 4%{left:-72px; top:4%;} 5%{left:-63px; top:5%;} 6%{left:-54px; top:6%;} 7%{left:-46px; top:7%;} 8%{left:-39px; top:8%;} 9%{left:-32px; top:9%;} 10%{left:-26px; top:10%;} 11%{left:-21px; top:11%;} 12%{left:-17px; top:12%;} 13%{left:-14px; top:13%;} 14%{left:-12px; top:14%;} 15%{left:-11px; top:15%;} 16%{left:-11px; top:16%;} 17%{left:-11px; top:17%;} 18%{left:-13px; top:18%;} 19%{left:-16px; top:19%;} 20%{left:-20px; top:20%;} 21%{left:-24px; top:21%;} 22%{left:-30px; top:22%;} 23%{left:-36px; top:23%;} 24%{left:-43px; top:24%;} 25%{left:-51px; top:25%;} 26%{left:-59px; top:26%;} 27%{left:-68px; top:27%;} 28%{left:-77px; top:28%;} 29%{left:-87px; top:29%;} 30%{left:-96px; top:30%;} 31%{left:-106px; top:31%;} 32%{left:-116px; top:32%;} 33%{left:-126px; top:33%;} 34%{left:-136px; top:34%;} 35%{left:-146px; top:35%;} 36%{left:-155px; top:36%;} 37%{left:-163px; top:37%;} 38%{left:-172px; top:38%;} 39%{left:-179px; top:39%;} 40%{left:-186px; top:40%;} 41%{left:-192px; top:41%;} 42%{left:-198px; top:42%;} 43%{left:-202px; top:43%;} 44%{left:-206px; top:44%;} 45%{left:-208px; top:45%;} 46%{left:-210px; top:46%;} 47%{left:-210px; top:47%;} 48%{left:-210px; top:48%;} 49%{left:-209px; top:49%;} 50%{left:-206px; top:50%;} 51%{left:-203px; top:51%;} 52%{left:-199px; top:52%;} 53%{left:-194px; top:53%;} 54%{left:-188px; top:54%;} 55%{left:-181px; top:55%;} 56%{left:-174px; top:56%;} 57%{left:-166px; top:57%;} 58%{left:-157px; top:58%;} 59%{left:-148px; top:59%;} 60%{left:-138px; top:60%;} 61%{left:-129px; top:61%;} 62%{left:-119px; top:62%;} 63%{left:-109px; top:63%;} 64%{left:-99px; top:64%;} 65%{left:-89px; top:65%;} 66%{left:-79px; top:66%;} 67%{left:-70px; top:67%;} 68%{left:-61px; top:68%;} 69%{left:-53px; top:69%;} 70%{left:-45px; top:70%;} 71%{left:-38px; top:71%;} 72%{left:-31px; top:72%;} 73%{left:-25px; top:73%;} 74%{left:-21px; top:74%;} 75%{left:-17px; top:75%;} 76%{left:-14px; top:76%;} 77%{left:-12px; top:77%;} 78%{left:-11px; top:78%;} 79%{left:-11px; top:79%;} 80%{left:-12px; top:80%;} 81%{left:-14px; top:81%;} 82%{left:-16px; top:82%;} 83%{left:-20px; top:83%;} 84%{left:-25px; top:84%;} 85%{left:-31px; top:85%;} 86%{left:-37px; top:86%;} 87%{left:-44px; top:87%;} 88%{left:-52px; top:88%;} 89%{left:-60px; top:89%;} 90%{left:-69px; top:90%;} 91%{left:-79px; top:91%;} 92%{left:-88px; top:92%;} 93%{left:-98px; top:93%;} 94%{left:-108px; top:94%;} 95%{left:-118px; top:95%;} 96%{left:-128px; top:96%;} 97%{left:-138px; top:97%;} 98%{left:-147px; top:98%;} 99%{left:-156px; top:99%;} 100%{left:-165px; top:100%;} }</style><span style="left:110vw;"><div style="animation-delay:6.7s;"></div></span><span style="left:100vw;"><div style="animation-delay:17.4s;"></div></span><span style="left:90vw;"><div style="animation-delay:12.9s;"></div></span><span style="left:80vw;"><div style="animation-delay:14.6s;"></div></span><span style="left:70vw;"><div style="animation-delay:10.5s;"></div></span><span style="left:60vw;"><div style="animation-delay:1.9s;"></div></span><span style="left:50vw;"><div style="animation-delay:3.3s;"></div></span><span style="left:40vw;"><div style="animation-delay:13.9s;"></div></span><span style="left:30vw;"><div style="animation-delay:2.5s;"></div></span><span style="left:20vw;"><div style="animation-delay:12s;"></div></span><span style="left:10vw;"><div style="animation-delay:16.9s;"></div></span><span style="left:0vw;"><div style="animation-delay:11.2s;"></div></span><span style="left:-10vw;"><div style="animation-delay:18.7s;"></div></span></section>
solarcircuits
https://solarcircuits.neocities.org/
demo
clone
id: 2080029885
good stuff
source: (triple click to highlight all)
<section id="snowflakes2080029885"><!--snowflakes(v1) generated with: https://snowfallgarden.lophius.xyz--><style>#snowflakes2080029885 { overflow:hidden; pointer-events:none; image-rendering:pixelated; } #snowflakes2080029885 > span { position:fixed; top:-35px; height:calc(100vh + 35px); } #snowflakes2080029885 span div { width:35px; height:35px; position:relative; background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACMAAAAjCAYAAAAe2bNZAAAAAXNSR0IArs4c6QAAAOhJREFUWEftl1ELwyAMhOPPFrqnDfzZHQ4ygqjcJS1zYJ81+bi7qE2y0Je8LKfIOdqbRFx16U0ziBaOhaJgGBAFY4D+E8ajCqsOrMwyMBEQRh1ImQ0zOsS2MlsZo8Cepsltjz0iIhOFXpaQTRV3w8xM86iDWlT7wjYpJAPEgLhg0PywIG6YmUoeCPPMwEZ7tOrI+fuX8CqFtt3WDW3W/Dxylmcpn7o/UcYG2cJEgELK1MZqU9SiUICvzIo7wHdAuGCutKQ3nVRmejBWqbYBmyMKRpu1AL2mHhVdMOgxyQLdCqOjj9q1FMwbLR9mJKLXvdAAAAAASUVORK5CYII=); animation: sine 15s linear 0s infinite normal;} @keyframes sine { 0%{left:-110px; top:0%;} 1%{left:-101px; top:1%;} 2%{left:-91px; top:2%;} 3%{left:-81px; top:3%;} 4%{left:-72px; top:4%;} 5%{left:-63px; top:5%;} 6%{left:-54px; top:6%;} 7%{left:-46px; top:7%;} 8%{left:-39px; top:8%;} 9%{left:-32px; top:9%;} 10%{left:-26px; top:10%;} 11%{left:-21px; top:11%;} 12%{left:-17px; top:12%;} 13%{left:-14px; top:13%;} 14%{left:-12px; top:14%;} 15%{left:-11px; top:15%;} 16%{left:-11px; top:16%;} 17%{left:-11px; top:17%;} 18%{left:-13px; top:18%;} 19%{left:-16px; top:19%;} 20%{left:-20px; top:20%;} 21%{left:-24px; top:21%;} 22%{left:-30px; top:22%;} 23%{left:-36px; top:23%;} 24%{left:-43px; top:24%;} 25%{left:-51px; top:25%;} 26%{left:-59px; top:26%;} 27%{left:-68px; top:27%;} 28%{left:-77px; top:28%;} 29%{left:-87px; top:29%;} 30%{left:-96px; top:30%;} 31%{left:-106px; top:31%;} 32%{left:-116px; top:32%;} 33%{left:-126px; top:33%;} 34%{left:-136px; top:34%;} 35%{left:-146px; top:35%;} 36%{left:-155px; top:36%;} 37%{left:-163px; top:37%;} 38%{left:-172px; top:38%;} 39%{left:-179px; top:39%;} 40%{left:-186px; top:40%;} 41%{left:-192px; top:41%;} 42%{left:-198px; top:42%;} 43%{left:-202px; top:43%;} 44%{left:-206px; top:44%;} 45%{left:-208px; top:45%;} 46%{left:-210px; top:46%;} 47%{left:-210px; top:47%;} 48%{left:-210px; top:48%;} 49%{left:-209px; top:49%;} 50%{left:-206px; top:50%;} 51%{left:-203px; top:51%;} 52%{left:-199px; top:52%;} 53%{left:-194px; top:53%;} 54%{left:-188px; top:54%;} 55%{left:-181px; top:55%;} 56%{left:-174px; top:56%;} 57%{left:-166px; top:57%;} 58%{left:-157px; top:58%;} 59%{left:-148px; top:59%;} 60%{left:-138px; top:60%;} 61%{left:-129px; top:61%;} 62%{left:-119px; top:62%;} 63%{left:-109px; top:63%;} 64%{left:-99px; top:64%;} 65%{left:-89px; top:65%;} 66%{left:-79px; top:66%;} 67%{left:-70px; top:67%;} 68%{left:-61px; top:68%;} 69%{left:-53px; top:69%;} 70%{left:-45px; top:70%;} 71%{left:-38px; top:71%;} 72%{left:-31px; top:72%;} 73%{left:-25px; top:73%;} 74%{left:-21px; top:74%;} 75%{left:-17px; top:75%;} 76%{left:-14px; top:76%;} 77%{left:-12px; top:77%;} 78%{left:-11px; top:78%;} 79%{left:-11px; top:79%;} 80%{left:-12px; top:80%;} 81%{left:-14px; top:81%;} 82%{left:-16px; top:82%;} 83%{left:-20px; top:83%;} 84%{left:-25px; top:84%;} 85%{left:-31px; top:85%;} 86%{left:-37px; top:86%;} 87%{left:-44px; top:87%;} 88%{left:-52px; top:88%;} 89%{left:-60px; top:89%;} 90%{left:-69px; top:90%;} 91%{left:-79px; top:91%;} 92%{left:-88px; top:92%;} 93%{left:-98px; top:93%;} 94%{left:-108px; top:94%;} 95%{left:-118px; top:95%;} 96%{left:-128px; top:96%;} 97%{left:-138px; top:97%;} 98%{left:-147px; top:98%;} 99%{left:-156px; top:99%;} 100%{left:-165px; top:100%;} }</style><span style="left:110vw;"><div style="animation-delay:17.4s;"></div></span><span style="left:100vw;"><div style="animation-delay:18s;"></div></span><span style="left:90vw;"><div style="animation-delay:13.7s;"></div></span><span style="left:80vw;"><div style="animation-delay:7.2s;"></div></span><span style="left:70vw;"><div style="animation-delay:3.3s;"></div></span><span style="left:60vw;"><div style="animation-delay:2.2s;"></div></span><span style="left:50vw;"><div style="animation-delay:1.4s;"></div></span><span style="left:40vw;"><div style="animation-delay:7.2s;"></div></span><span style="left:30vw;"><div style="animation-delay:16s;"></div></span><span style="left:20vw;"><div style="animation-delay:1.9s;"></div></span><span style="left:10vw;"><div style="animation-delay:10.4s;"></div></span><span style="left:0vw;"><div style="animation-delay:3.3s;"></div></span><span style="left:-10vw;"><div style="animation-delay:1.8s;"></div></span></section>
fruit
demo
clone
id: 115695953
awawaawawawawawawawawawawawawawawawawawawawawawawaw
source: (triple click to highlight all)
<section id="snowflakes115695953"><!--snowflakes(v1) generated with: https://snowfallgarden.lophius.xyz--><style>#snowflakes115695953 { overflow:hidden; pointer-events:none; image-rendering:pixelated; } #snowflakes115695953 > span { position:fixed; top:-35px; height:calc(100vh + 35px); } #snowflakes115695953 span div { width:35px; height:35px; position:relative; background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACMAAAAjCAYAAAAe2bNZAAAAAXNSR0IArs4c6QAAAg1JREFUWEfNmFFSxDAMQ5sfOBDc/wRwIPgp4868oqgKLUzZdn+2m8aOYstysm2Sz9vHPPPz5WmaWmtN39fzPM+zj5fd63M/N83D/v3z26vaNRwBpF7WM2D0OS1QY7h2kMyv7wJQvvXZ11x2roO+YNr1yEb9eETdD+uozRKFMiRcCuaoc7fxlDl4TzfrdJwgJTW5Qu4c0nToO48C6WDcOUJqSd3q1x2BGkDpve6MDSgnEvHxA5A0Z42MTzq68wJRZOc7RTVFLm16YTcpIbyghnQKNBERILrbPdu4rpYuRIOAujAlmXToL/OSzUbUdJJXkzsgJaonyrWjvjoCu/hQ6sobxFDLVkFUikYalfz4GuV3FT1dxFVZDZMeKYikOXubYr2NAqtAOQgFqb3LwVDmOp/IkhLlJetsOKNlmMo9OXVpH0VyT7s27QAw3q9q3BWTOegMINRHvXPt8XbRtYNUNSPlHTlyIJ7ukfB1jXLEETfW3avWaN85Mkc548SOhydVVDfAWVLl1HfcHvFMh7eumpK+jKJQ4x6JUyJzG844kMuraVQ5D9cZrSZXxUsU2M8ot+lNqYMnea+xf+naypmjZxDl02nnmVud9G51Bk7yfqTJ6d3ntNtB0pif7jYKnlsFYPx28Vvf97pReju4/K7tp7p0GfOQJ5tRn4OD6WbRHa5cbS//f8Y7NWeVR/9z9QVejKJwSC2OwgAAAABJRU5ErkJggg==); animation: sine 15s linear 0s infinite normal;} @keyframes sine { 0%{left:-110px; top:0%;} 1%{left:-101px; top:1%;} 2%{left:-91px; top:2%;} 3%{left:-81px; top:3%;} 4%{left:-72px; top:4%;} 5%{left:-63px; top:5%;} 6%{left:-54px; top:6%;} 7%{left:-46px; top:7%;} 8%{left:-39px; top:8%;} 9%{left:-32px; top:9%;} 10%{left:-26px; top:10%;} 11%{left:-21px; top:11%;} 12%{left:-17px; top:12%;} 13%{left:-14px; top:13%;} 14%{left:-12px; top:14%;} 15%{left:-11px; top:15%;} 16%{left:-11px; top:16%;} 17%{left:-11px; top:17%;} 18%{left:-13px; top:18%;} 19%{left:-16px; top:19%;} 20%{left:-20px; top:20%;} 21%{left:-24px; top:21%;} 22%{left:-30px; top:22%;} 23%{left:-36px; top:23%;} 24%{left:-43px; top:24%;} 25%{left:-51px; top:25%;} 26%{left:-59px; top:26%;} 27%{left:-68px; top:27%;} 28%{left:-77px; top:28%;} 29%{left:-87px; top:29%;} 30%{left:-96px; top:30%;} 31%{left:-106px; top:31%;} 32%{left:-116px; top:32%;} 33%{left:-126px; top:33%;} 34%{left:-136px; top:34%;} 35%{left:-146px; top:35%;} 36%{left:-155px; top:36%;} 37%{left:-163px; top:37%;} 38%{left:-172px; top:38%;} 39%{left:-179px; top:39%;} 40%{left:-186px; top:40%;} 41%{left:-192px; top:41%;} 42%{left:-198px; top:42%;} 43%{left:-202px; top:43%;} 44%{left:-206px; top:44%;} 45%{left:-208px; top:45%;} 46%{left:-210px; top:46%;} 47%{left:-210px; top:47%;} 48%{left:-210px; top:48%;} 49%{left:-209px; top:49%;} 50%{left:-206px; top:50%;} 51%{left:-203px; top:51%;} 52%{left:-199px; top:52%;} 53%{left:-194px; top:53%;} 54%{left:-188px; top:54%;} 55%{left:-181px; top:55%;} 56%{left:-174px; top:56%;} 57%{left:-166px; top:57%;} 58%{left:-157px; top:58%;} 59%{left:-148px; top:59%;} 60%{left:-138px; top:60%;} 61%{left:-129px; top:61%;} 62%{left:-119px; top:62%;} 63%{left:-109px; top:63%;} 64%{left:-99px; top:64%;} 65%{left:-89px; top:65%;} 66%{left:-79px; top:66%;} 67%{left:-70px; top:67%;} 68%{left:-61px; top:68%;} 69%{left:-53px; top:69%;} 70%{left:-45px; top:70%;} 71%{left:-38px; top:71%;} 72%{left:-31px; top:72%;} 73%{left:-25px; top:73%;} 74%{left:-21px; top:74%;} 75%{left:-17px; top:75%;} 76%{left:-14px; top:76%;} 77%{left:-12px; top:77%;} 78%{left:-11px; top:78%;} 79%{left:-11px; top:79%;} 80%{left:-12px; top:80%;} 81%{left:-14px; top:81%;} 82%{left:-16px; top:82%;} 83%{left:-20px; top:83%;} 84%{left:-25px; top:84%;} 85%{left:-31px; top:85%;} 86%{left:-37px; top:86%;} 87%{left:-44px; top:87%;} 88%{left:-52px; top:88%;} 89%{left:-60px; top:89%;} 90%{left:-69px; top:90%;} 91%{left:-79px; top:91%;} 92%{left:-88px; top:92%;} 93%{left:-98px; top:93%;} 94%{left:-108px; top:94%;} 95%{left:-118px; top:95%;} 96%{left:-128px; top:96%;} 97%{left:-138px; top:97%;} 98%{left:-147px; top:98%;} 99%{left:-156px; top:99%;} 100%{left:-165px; top:100%;} }</style><span style="left:110vw;"><div style="animation-delay:7.8s;"></div></span><span style="left:100vw;"><div style="animation-delay:7.8s;"></div></span><span style="left:90vw;"><div style="animation-delay:2.6s;"></div></span><span style="left:80vw;"><div style="animation-delay:10.9s;"></div></span><span style="left:70vw;"><div style="animation-delay:5.1s;"></div></span><span style="left:60vw;"><div style="animation-delay:15.5s;"></div></span><span style="left:50vw;"><div style="animation-delay:15.9s;"></div></span><span style="left:40vw;"><div style="animation-delay:14.3s;"></div></span><span style="left:30vw;"><div style="animation-delay:19.9s;"></div></span><span style="left:20vw;"><div style="animation-delay:1.8s;"></div></span><span style="left:10vw;"><div style="animation-delay:18.5s;"></div></span><span style="left:0vw;"><div style="animation-delay:12.7s;"></div></span><span style="left:-10vw;"><div style="animation-delay:12.7s;"></div></span></section>
rin
demo
clone
id: 3430555229
this is so cool! thank you!
source: (triple click to highlight all)
<section id="snowflakes3430555229"><!--snowflakes(v1) generated with: https://snowfallgarden.lophius.xyz--><style>#snowflakes3430555229 { overflow:hidden; pointer-events:none; image-rendering:pixelated; } #snowflakes3430555229 > span { position:fixed; top:-35px; height:calc(100vh + 35px); } #snowflakes3430555229 span div { width:35px; height:35px; position:relative; background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACMAAAAjCAYAAAAe2bNZAAAA70lEQVRYR+2WwQ6EIAxE5f8/elc2aUKIZWagrDWRiweVPl4HsRyJRknEcjwb5nOOarOcI9qqNGEFqRB2vQ2mN7IDiDbTF08FU1sUDUSZ8Yq+MLNmLPS269DnYKlNXm5aiBYAfaPCYVDBUc5CYRAI2oFhMAzIX2DYgIbBeIcja8SAlzMzWlEqGOXkRuBUgM3M6n8MOj5oGBQ+ZAiB/BaKJmnvMxNezce+J8OorWJBZDNKq1BYrwxKZhCMd0CyUZiCsVapvwgIiobpC6vZQSBTmUGtYop6z9Bm+i2exszK6kfvTpl5YXYZCA3wLshUmfkCSoLwJOM+joYAAAAASUVORK5CYII=); animation: sine 15s linear 0s infinite normal;} @keyframes sine { 0%{left:-110px; top:0%;} 1%{left:-101px; top:1%;} 2%{left:-91px; top:2%;} 3%{left:-81px; top:3%;} 4%{left:-72px; top:4%;} 5%{left:-63px; top:5%;} 6%{left:-54px; top:6%;} 7%{left:-46px; top:7%;} 8%{left:-39px; top:8%;} 9%{left:-32px; top:9%;} 10%{left:-26px; top:10%;} 11%{left:-21px; top:11%;} 12%{left:-17px; top:12%;} 13%{left:-14px; top:13%;} 14%{left:-12px; top:14%;} 15%{left:-11px; top:15%;} 16%{left:-11px; top:16%;} 17%{left:-11px; top:17%;} 18%{left:-13px; top:18%;} 19%{left:-16px; top:19%;} 20%{left:-20px; top:20%;} 21%{left:-24px; top:21%;} 22%{left:-30px; top:22%;} 23%{left:-36px; top:23%;} 24%{left:-43px; top:24%;} 25%{left:-51px; top:25%;} 26%{left:-59px; top:26%;} 27%{left:-68px; top:27%;} 28%{left:-77px; top:28%;} 29%{left:-87px; top:29%;} 30%{left:-96px; top:30%;} 31%{left:-106px; top:31%;} 32%{left:-116px; top:32%;} 33%{left:-126px; top:33%;} 34%{left:-136px; top:34%;} 35%{left:-146px; top:35%;} 36%{left:-155px; top:36%;} 37%{left:-163px; top:37%;} 38%{left:-172px; top:38%;} 39%{left:-179px; top:39%;} 40%{left:-186px; top:40%;} 41%{left:-192px; top:41%;} 42%{left:-198px; top:42%;} 43%{left:-202px; top:43%;} 44%{left:-206px; top:44%;} 45%{left:-208px; top:45%;} 46%{left:-210px; top:46%;} 47%{left:-210px; top:47%;} 48%{left:-210px; top:48%;} 49%{left:-209px; top:49%;} 50%{left:-206px; top:50%;} 51%{left:-203px; top:51%;} 52%{left:-199px; top:52%;} 53%{left:-194px; top:53%;} 54%{left:-188px; top:54%;} 55%{left:-181px; top:55%;} 56%{left:-174px; top:56%;} 57%{left:-166px; top:57%;} 58%{left:-157px; top:58%;} 59%{left:-148px; top:59%;} 60%{left:-138px; top:60%;} 61%{left:-129px; top:61%;} 62%{left:-119px; top:62%;} 63%{left:-109px; top:63%;} 64%{left:-99px; top:64%;} 65%{left:-89px; top:65%;} 66%{left:-79px; top:66%;} 67%{left:-70px; top:67%;} 68%{left:-61px; top:68%;} 69%{left:-53px; top:69%;} 70%{left:-45px; top:70%;} 71%{left:-38px; top:71%;} 72%{left:-31px; top:72%;} 73%{left:-25px; top:73%;} 74%{left:-21px; top:74%;} 75%{left:-17px; top:75%;} 76%{left:-14px; top:76%;} 77%{left:-12px; top:77%;} 78%{left:-11px; top:78%;} 79%{left:-11px; top:79%;} 80%{left:-12px; top:80%;} 81%{left:-14px; top:81%;} 82%{left:-16px; top:82%;} 83%{left:-20px; top:83%;} 84%{left:-25px; top:84%;} 85%{left:-31px; top:85%;} 86%{left:-37px; top:86%;} 87%{left:-44px; top:87%;} 88%{left:-52px; top:88%;} 89%{left:-60px; top:89%;} 90%{left:-69px; top:90%;} 91%{left:-79px; top:91%;} 92%{left:-88px; top:92%;} 93%{left:-98px; top:93%;} 94%{left:-108px; top:94%;} 95%{left:-118px; top:95%;} 96%{left:-128px; top:96%;} 97%{left:-138px; top:97%;} 98%{left:-147px; top:98%;} 99%{left:-156px; top:99%;} 100%{left:-165px; top:100%;} }</style><span style="left:110vw;"><div style="animation-delay:6.7s;"></div></span><span style="left:100vw;"><div style="animation-delay:4.1s;"></div></span><span style="left:90vw;"><div style="animation-delay:4s;"></div></span><span style="left:80vw;"><div style="animation-delay:1.7s;"></div></span><span style="left:70vw;"><div style="animation-delay:3.6s;"></div></span><span style="left:60vw;"><div style="animation-delay:4s;"></div></span><span style="left:50vw;"><div style="animation-delay:9.5s;"></div></span><span style="left:40vw;"><div style="animation-delay:17.4s;"></div></span><span style="left:30vw;"><div style="animation-delay:19.1s;"></div></span><span style="left:20vw;"><div style="animation-delay:18.6s;"></div></span><span style="left:10vw;"><div style="animation-delay:18.5s;"></div></span><span style="left:0vw;"><div style="animation-delay:19s;"></div></span><span style="left:-10vw;"><div style="animation-delay:13.2s;"></div></span></section>
Arman
https://arman-m.neocities.org
demo
clone
id: 1688852542
My site has a spacey theme, so i made this little star for all my space themed bros to use 8D
source: (triple click to highlight all)
<section id="snowflakes1688852542"><!--snowflakes(v1) generated with: https://snowfallgarden.lophius.xyz--><style>#snowflakes1688852542 { overflow:hidden; pointer-events:none; image-rendering:pixelated; } #snowflakes1688852542 > span { position:fixed; top:-15px; height:calc(100vh + 15px); } #snowflakes1688852542 span div { width:15px; height:15px; position:relative; background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA8AAAAPCAYAAAA71pVKAAAAiUlEQVQoU61T2w2AIAykq4gr6hC6orgKWpMzJ9CSEPtJuUevIMGpY0t5XqNYV8yGAobBCozLFNJ+BkvdVB4GA4hZLXXRixyIWrVKSbge26WStwHtwcln5h5Jab8KzCJozf2fMqtyOAjRtZ3v4kAQHJPKXTivbGuj9aKwUu694N47ZhcgcD9Gb98XeJ9kUs4viM8AAAAASUVORK5CYII=); animation: sine 15s linear 0s infinite normal;} @keyframes sine { 0%{left:-110px; top:0%;} 1%{left:-101px; top:1%;} 2%{left:-91px; top:2%;} 3%{left:-81px; top:3%;} 4%{left:-72px; top:4%;} 5%{left:-63px; top:5%;} 6%{left:-54px; top:6%;} 7%{left:-46px; top:7%;} 8%{left:-39px; top:8%;} 9%{left:-32px; top:9%;} 10%{left:-26px; top:10%;} 11%{left:-21px; top:11%;} 12%{left:-17px; top:12%;} 13%{left:-14px; top:13%;} 14%{left:-12px; top:14%;} 15%{left:-11px; top:15%;} 16%{left:-11px; top:16%;} 17%{left:-11px; top:17%;} 18%{left:-13px; top:18%;} 19%{left:-16px; top:19%;} 20%{left:-20px; top:20%;} 21%{left:-24px; top:21%;} 22%{left:-30px; top:22%;} 23%{left:-36px; top:23%;} 24%{left:-43px; top:24%;} 25%{left:-51px; top:25%;} 26%{left:-59px; top:26%;} 27%{left:-68px; top:27%;} 28%{left:-77px; top:28%;} 29%{left:-87px; top:29%;} 30%{left:-96px; top:30%;} 31%{left:-106px; top:31%;} 32%{left:-116px; top:32%;} 33%{left:-126px; top:33%;} 34%{left:-136px; top:34%;} 35%{left:-146px; top:35%;} 36%{left:-155px; top:36%;} 37%{left:-163px; top:37%;} 38%{left:-172px; top:38%;} 39%{left:-179px; top:39%;} 40%{left:-186px; top:40%;} 41%{left:-192px; top:41%;} 42%{left:-198px; top:42%;} 43%{left:-202px; top:43%;} 44%{left:-206px; top:44%;} 45%{left:-208px; top:45%;} 46%{left:-210px; top:46%;} 47%{left:-210px; top:47%;} 48%{left:-210px; top:48%;} 49%{left:-209px; top:49%;} 50%{left:-206px; top:50%;} 51%{left:-203px; top:51%;} 52%{left:-199px; top:52%;} 53%{left:-194px; top:53%;} 54%{left:-188px; top:54%;} 55%{left:-181px; top:55%;} 56%{left:-174px; top:56%;} 57%{left:-166px; top:57%;} 58%{left:-157px; top:58%;} 59%{left:-148px; top:59%;} 60%{left:-138px; top:60%;} 61%{left:-129px; top:61%;} 62%{left:-119px; top:62%;} 63%{left:-109px; top:63%;} 64%{left:-99px; top:64%;} 65%{left:-89px; top:65%;} 66%{left:-79px; top:66%;} 67%{left:-70px; top:67%;} 68%{left:-61px; top:68%;} 69%{left:-53px; top:69%;} 70%{left:-45px; top:70%;} 71%{left:-38px; top:71%;} 72%{left:-31px; top:72%;} 73%{left:-25px; top:73%;} 74%{left:-21px; top:74%;} 75%{left:-17px; top:75%;} 76%{left:-14px; top:76%;} 77%{left:-12px; top:77%;} 78%{left:-11px; top:78%;} 79%{left:-11px; top:79%;} 80%{left:-12px; top:80%;} 81%{left:-14px; top:81%;} 82%{left:-16px; top:82%;} 83%{left:-20px; top:83%;} 84%{left:-25px; top:84%;} 85%{left:-31px; top:85%;} 86%{left:-37px; top:86%;} 87%{left:-44px; top:87%;} 88%{left:-52px; top:88%;} 89%{left:-60px; top:89%;} 90%{left:-69px; top:90%;} 91%{left:-79px; top:91%;} 92%{left:-88px; top:92%;} 93%{left:-98px; top:93%;} 94%{left:-108px; top:94%;} 95%{left:-118px; top:95%;} 96%{left:-128px; top:96%;} 97%{left:-138px; top:97%;} 98%{left:-147px; top:98%;} 99%{left:-156px; top:99%;} 100%{left:-165px; top:100%;} }</style><span style="left:110vw;"><div style="animation-delay:11.4s;"></div></span><span style="left:100vw;"><div style="animation-delay:5s;"></div></span><span style="left:90vw;"><div style="animation-delay:0.7s;"></div></span><span style="left:80vw;"><div style="animation-delay:11.4s;"></div></span><span style="left:70vw;"><div style="animation-delay:15.4s;"></div></span><span style="left:60vw;"><div style="animation-delay:2.7s;"></div></span><span style="left:50vw;"><div style="animation-delay:8.2s;"></div></span><span style="left:40vw;"><div style="animation-delay:2.8s;"></div></span><span style="left:30vw;"><div style="animation-delay:19s;"></div></span><span style="left:20vw;"><div style="animation-delay:13.1s;"></div></span><span style="left:10vw;"><div style="animation-delay:8.1s;"></div></span><span style="left:0vw;"><div style="animation-delay:8.7s;"></div></span><span style="left:-10vw;"><div style="animation-delay:9.4s;"></div></span></section>
df
demo
clone
id: 1871296627
source: (triple click to highlight all)
<section id="snowflakes1871296627"><!--snowflakes(v1) generated with: https://snowfallgarden.lophius.xyz--><style>#snowflakes1871296627 { overflow:hidden; pointer-events:none; image-rendering:pixelated; } #snowflakes1871296627 > span { position:fixed; top:-35px; height:calc(100vh + 35px); } #snowflakes1871296627 span div { width:35px; height:35px; position:relative; background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACMAAAAjCAYAAAAe2bNZAAAB3UlEQVRYR+WY3VHDMBCE41aSFqANeIMCoCwoAN6gDWghacVkM7OazeZOsgOJPINeHOek06f7k+Rh1Whf26fxdvM6tPq15FP0NCeZoqQFAvkUPWfDQHkGEVnyz2AwqU5AEPynUPqe9a9ZcZJlHEYVvt1tx8fPzcBnNJnCV2Fa5m4pmgtTmy+0jAO4Arhg3Des8v1+t3r4WJcn/hv2LRrDQM4sXYWhST02btYvBxFA4CL2g5UAhva9ey4e8fGzYRiAukJCcPUeJ3yn1SKoWpqfWMZTkDAOAqUZDGQRkGeYl4ADjAI4jCqlRTRePDvoJsRNNJb9ozkLDP1IBVDmK+QEKsNvdY/LFMh1aqDDSidFKxrM1SgoALKagaD2RbmOKOvSohcpcwAtdlpvFFKzLQNk/wKT7R1QQFdgkK+a6cw0j6zHMXSTwuq8IUzkAlrBA5QQhNLAVZm7lBZLYXyAVlrIWG2j4C6mlsBnf5VF2wFT/ChmPBWzAPWJtd9vdBy5aTGWUd8tImaiE1qXbHIXdakzfmzsXoH1MNV1b1rcrp2VZ4LiebXzjAevnzUov/pJT61BiO5nYB62MriL3A4Wf2/ygFYreXzNvcTVNt+zrrdd79rZV4VslRf9CvEvPxb9AD6VTHkfSrkUAAAAAElFTkSuQmCC); animation: sine 15s linear 0s infinite normal;} @keyframes sine { 0%{left:-110px; top:0%;} 1%{left:-101px; top:1%;} 2%{left:-91px; top:2%;} 3%{left:-81px; top:3%;} 4%{left:-72px; top:4%;} 5%{left:-63px; top:5%;} 6%{left:-54px; top:6%;} 7%{left:-46px; top:7%;} 8%{left:-39px; top:8%;} 9%{left:-32px; top:9%;} 10%{left:-26px; top:10%;} 11%{left:-21px; top:11%;} 12%{left:-17px; top:12%;} 13%{left:-14px; top:13%;} 14%{left:-12px; top:14%;} 15%{left:-11px; top:15%;} 16%{left:-11px; top:16%;} 17%{left:-11px; top:17%;} 18%{left:-13px; top:18%;} 19%{left:-16px; top:19%;} 20%{left:-20px; top:20%;} 21%{left:-24px; top:21%;} 22%{left:-30px; top:22%;} 23%{left:-36px; top:23%;} 24%{left:-43px; top:24%;} 25%{left:-51px; top:25%;} 26%{left:-59px; top:26%;} 27%{left:-68px; top:27%;} 28%{left:-77px; top:28%;} 29%{left:-87px; top:29%;} 30%{left:-96px; top:30%;} 31%{left:-106px; top:31%;} 32%{left:-116px; top:32%;} 33%{left:-126px; top:33%;} 34%{left:-136px; top:34%;} 35%{left:-146px; top:35%;} 36%{left:-155px; top:36%;} 37%{left:-163px; top:37%;} 38%{left:-172px; top:38%;} 39%{left:-179px; top:39%;} 40%{left:-186px; top:40%;} 41%{left:-192px; top:41%;} 42%{left:-198px; top:42%;} 43%{left:-202px; top:43%;} 44%{left:-206px; top:44%;} 45%{left:-208px; top:45%;} 46%{left:-210px; top:46%;} 47%{left:-210px; top:47%;} 48%{left:-210px; top:48%;} 49%{left:-209px; top:49%;} 50%{left:-206px; top:50%;} 51%{left:-203px; top:51%;} 52%{left:-199px; top:52%;} 53%{left:-194px; top:53%;} 54%{left:-188px; top:54%;} 55%{left:-181px; top:55%;} 56%{left:-174px; top:56%;} 57%{left:-166px; top:57%;} 58%{left:-157px; top:58%;} 59%{left:-148px; top:59%;} 60%{left:-138px; top:60%;} 61%{left:-129px; top:61%;} 62%{left:-119px; top:62%;} 63%{left:-109px; top:63%;} 64%{left:-99px; top:64%;} 65%{left:-89px; top:65%;} 66%{left:-79px; top:66%;} 67%{left:-70px; top:67%;} 68%{left:-61px; top:68%;} 69%{left:-53px; top:69%;} 70%{left:-45px; top:70%;} 71%{left:-38px; top:71%;} 72%{left:-31px; top:72%;} 73%{left:-25px; top:73%;} 74%{left:-21px; top:74%;} 75%{left:-17px; top:75%;} 76%{left:-14px; top:76%;} 77%{left:-12px; top:77%;} 78%{left:-11px; top:78%;} 79%{left:-11px; top:79%;} 80%{left:-12px; top:80%;} 81%{left:-14px; top:81%;} 82%{left:-16px; top:82%;} 83%{left:-20px; top:83%;} 84%{left:-25px; top:84%;} 85%{left:-31px; top:85%;} 86%{left:-37px; top:86%;} 87%{left:-44px; top:87%;} 88%{left:-52px; top:88%;} 89%{left:-60px; top:89%;} 90%{left:-69px; top:90%;} 91%{left:-79px; top:91%;} 92%{left:-88px; top:92%;} 93%{left:-98px; top:93%;} 94%{left:-108px; top:94%;} 95%{left:-118px; top:95%;} 96%{left:-128px; top:96%;} 97%{left:-138px; top:97%;} 98%{left:-147px; top:98%;} 99%{left:-156px; top:99%;} 100%{left:-165px; top:100%;} }</style><span style="left:110vw;"><div style="animation-delay:7s;"></div></span><span style="left:100vw;"><div style="animation-delay:0.9s;"></div></span><span style="left:90vw;"><div style="animation-delay:13.5s;"></div></span><span style="left:80vw;"><div style="animation-delay:15.4s;"></div></span><span style="left:70vw;"><div style="animation-delay:13.2s;"></div></span><span style="left:60vw;"><div style="animation-delay:4.9s;"></div></span><span style="left:50vw;"><div style="animation-delay:3.3s;"></div></span><span style="left:40vw;"><div style="animation-delay:8.1s;"></div></span><span style="left:30vw;"><div style="animation-delay:7.1s;"></div></span><span style="left:20vw;"><div style="animation-delay:6.9s;"></div></span><span style="left:10vw;"><div style="animation-delay:13.8s;"></div></span><span style="left:0vw;"><div style="animation-delay:1s;"></div></span><span style="left:-10vw;"><div style="animation-delay:19.8s;"></div></span></section>
Lian
https://libre.town
demo
clone
id: 1135429782
Red drops
source: (triple click to highlight all)
<section id="snowflakes1135429782"><!--snowflakes(v1) generated with: https://snowfallgarden.lophius.xyz--><style>#snowflakes1135429782 { overflow:hidden; pointer-events:none; image-rendering:pixelated; } #snowflakes1135429782 > span { position:fixed; top:-5px; height:calc(100vh + 5px); } #snowflakes1135429782 span div { width:5px; height:5px; position:relative; background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAO0lEQVQIW2NkAIIDMhr/QTQIODy5wcgIElD4/wcmxvCAkYWB8YG0ClwVSAZDECQAAowwM0FGgARBZgIATL8WD3qI3F8AAAAASUVORK5CYII=); animation: sine 15s linear 0s infinite normal;} @keyframes sine { 0%{left:-110px; top:0%;} 1%{left:-101px; top:1%;} 2%{left:-91px; top:2%;} 3%{left:-81px; top:3%;} 4%{left:-72px; top:4%;} 5%{left:-63px; top:5%;} 6%{left:-54px; top:6%;} 7%{left:-46px; top:7%;} 8%{left:-39px; top:8%;} 9%{left:-32px; top:9%;} 10%{left:-26px; top:10%;} 11%{left:-21px; top:11%;} 12%{left:-17px; top:12%;} 13%{left:-14px; top:13%;} 14%{left:-12px; top:14%;} 15%{left:-11px; top:15%;} 16%{left:-11px; top:16%;} 17%{left:-11px; top:17%;} 18%{left:-13px; top:18%;} 19%{left:-16px; top:19%;} 20%{left:-20px; top:20%;} 21%{left:-24px; top:21%;} 22%{left:-30px; top:22%;} 23%{left:-36px; top:23%;} 24%{left:-43px; top:24%;} 25%{left:-51px; top:25%;} 26%{left:-59px; top:26%;} 27%{left:-68px; top:27%;} 28%{left:-77px; top:28%;} 29%{left:-87px; top:29%;} 30%{left:-96px; top:30%;} 31%{left:-106px; top:31%;} 32%{left:-116px; top:32%;} 33%{left:-126px; top:33%;} 34%{left:-136px; top:34%;} 35%{left:-146px; top:35%;} 36%{left:-155px; top:36%;} 37%{left:-163px; top:37%;} 38%{left:-172px; top:38%;} 39%{left:-179px; top:39%;} 40%{left:-186px; top:40%;} 41%{left:-192px; top:41%;} 42%{left:-198px; top:42%;} 43%{left:-202px; top:43%;} 44%{left:-206px; top:44%;} 45%{left:-208px; top:45%;} 46%{left:-210px; top:46%;} 47%{left:-210px; top:47%;} 48%{left:-210px; top:48%;} 49%{left:-209px; top:49%;} 50%{left:-206px; top:50%;} 51%{left:-203px; top:51%;} 52%{left:-199px; top:52%;} 53%{left:-194px; top:53%;} 54%{left:-188px; top:54%;} 55%{left:-181px; top:55%;} 56%{left:-174px; top:56%;} 57%{left:-166px; top:57%;} 58%{left:-157px; top:58%;} 59%{left:-148px; top:59%;} 60%{left:-138px; top:60%;} 61%{left:-129px; top:61%;} 62%{left:-119px; top:62%;} 63%{left:-109px; top:63%;} 64%{left:-99px; top:64%;} 65%{left:-89px; top:65%;} 66%{left:-79px; top:66%;} 67%{left:-70px; top:67%;} 68%{left:-61px; top:68%;} 69%{left:-53px; top:69%;} 70%{left:-45px; top:70%;} 71%{left:-38px; top:71%;} 72%{left:-31px; top:72%;} 73%{left:-25px; top:73%;} 74%{left:-21px; top:74%;} 75%{left:-17px; top:75%;} 76%{left:-14px; top:76%;} 77%{left:-12px; top:77%;} 78%{left:-11px; top:78%;} 79%{left:-11px; top:79%;} 80%{left:-12px; top:80%;} 81%{left:-14px; top:81%;} 82%{left:-16px; top:82%;} 83%{left:-20px; top:83%;} 84%{left:-25px; top:84%;} 85%{left:-31px; top:85%;} 86%{left:-37px; top:86%;} 87%{left:-44px; top:87%;} 88%{left:-52px; top:88%;} 89%{left:-60px; top:89%;} 90%{left:-69px; top:90%;} 91%{left:-79px; top:91%;} 92%{left:-88px; top:92%;} 93%{left:-98px; top:93%;} 94%{left:-108px; top:94%;} 95%{left:-118px; top:95%;} 96%{left:-128px; top:96%;} 97%{left:-138px; top:97%;} 98%{left:-147px; top:98%;} 99%{left:-156px; top:99%;} 100%{left:-165px; top:100%;} }</style><span style="left:110vw;"><div style="animation-delay:4.9s;"></div></span><span style="left:100vw;"><div style="animation-delay:3.8s;"></div></span><span style="left:90vw;"><div style="animation-delay:17.8s;"></div></span><span style="left:80vw;"><div style="animation-delay:10.3s;"></div></span><span style="left:70vw;"><div style="animation-delay:9.5s;"></div></span><span style="left:60vw;"><div style="animation-delay:14.4s;"></div></span><span style="left:50vw;"><div style="animation-delay:3.7s;"></div></span><span style="left:40vw;"><div style="animation-delay:16.3s;"></div></span><span style="left:30vw;"><div style="animation-delay:2.9s;"></div></span><span style="left:20vw;"><div style="animation-delay:9.1s;"></div></span><span style="left:10vw;"><div style="animation-delay:10.3s;"></div></span><span style="left:0vw;"><div style="animation-delay:7s;"></div></span><span style="left:-10vw;"><div style="animation-delay:20s;"></div></span></section>
Stella
demo
clone
id: 1865061503
source: (triple click to highlight all)
<section id="snowflakes1865061503"><!--snowflakes(v1) generated with: https://snowfallgarden.lophius.xyz--><style>#snowflakes1865061503 { overflow:hidden; pointer-events:none; image-rendering:pixelated; } #snowflakes1865061503 > span { position:fixed; top:-35px; height:calc(100vh + 35px); } #snowflakes1865061503 span div { width:35px; height:35px; position:relative; background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACMAAAAjCAYAAAAe2bNZAAABq0lEQVRYR9VYuxLCMAyjMxM/xMfzQ0zMhXDnnqpKdigHhC601A/ZseWk02HHNT+u6XGFavXc62Ix2KvQ5Jrz9huAEAy/e8VuCeZ2Oc3H83UjFwDCeYDjLAUYZwfBpmCagRB2gBAEZgudVHZCdgNGRZBFxZlRy9Jrs1ymZvwTYBToFRh2GutfgWmF7GoFg2EZtptmJnPAbf2KrOuwBUxvkbGhnppxdcTNMQWI6BZ+riLuBYN2nM9VZhBQ3COJKbJzrZ3pYa3gvawZFFCktiIqGgv8TmXONcSmm5oxJjhlUNG+y5wiQ16qpwwXlxLCecQzifVxXi3MCtmLVldBp/yQdQ6DUiDceFDd9SzwiLrXGA5IN7UdCeJyq2BWexKOhJUx7dXUznSRMNFnCsYpqf/dPibb3/C78TKD7OjWNZtFrL+7Ziq6x8qvCpApYFc3ocOf8sy7QPiU4EgR5RzxjTmb3CT96tQedj8T9aOOJWqeuAHqZFV94sAccw8cFY5ZCQ4a4nQQaa3AuH1Ljz4u3f+cKKvjS9b2VbGqIi+Pt8N8haja+evfZ+x+9QNfru4vs/3IMXQJCgAAAABJRU5ErkJggg==); animation: sine 15s linear 0s infinite normal;} @keyframes sine { 0%{left:-110px; top:0%;} 1%{left:-101px; top:1%;} 2%{left:-91px; top:2%;} 3%{left:-81px; top:3%;} 4%{left:-72px; top:4%;} 5%{left:-63px; top:5%;} 6%{left:-54px; top:6%;} 7%{left:-46px; top:7%;} 8%{left:-39px; top:8%;} 9%{left:-32px; top:9%;} 10%{left:-26px; top:10%;} 11%{left:-21px; top:11%;} 12%{left:-17px; top:12%;} 13%{left:-14px; top:13%;} 14%{left:-12px; top:14%;} 15%{left:-11px; top:15%;} 16%{left:-11px; top:16%;} 17%{left:-11px; top:17%;} 18%{left:-13px; top:18%;} 19%{left:-16px; top:19%;} 20%{left:-20px; top:20%;} 21%{left:-24px; top:21%;} 22%{left:-30px; top:22%;} 23%{left:-36px; top:23%;} 24%{left:-43px; top:24%;} 25%{left:-51px; top:25%;} 26%{left:-59px; top:26%;} 27%{left:-68px; top:27%;} 28%{left:-77px; top:28%;} 29%{left:-87px; top:29%;} 30%{left:-96px; top:30%;} 31%{left:-106px; top:31%;} 32%{left:-116px; top:32%;} 33%{left:-126px; top:33%;} 34%{left:-136px; top:34%;} 35%{left:-146px; top:35%;} 36%{left:-155px; top:36%;} 37%{left:-163px; top:37%;} 38%{left:-172px; top:38%;} 39%{left:-179px; top:39%;} 40%{left:-186px; top:40%;} 41%{left:-192px; top:41%;} 42%{left:-198px; top:42%;} 43%{left:-202px; top:43%;} 44%{left:-206px; top:44%;} 45%{left:-208px; top:45%;} 46%{left:-210px; top:46%;} 47%{left:-210px; top:47%;} 48%{left:-210px; top:48%;} 49%{left:-209px; top:49%;} 50%{left:-206px; top:50%;} 51%{left:-203px; top:51%;} 52%{left:-199px; top:52%;} 53%{left:-194px; top:53%;} 54%{left:-188px; top:54%;} 55%{left:-181px; top:55%;} 56%{left:-174px; top:56%;} 57%{left:-166px; top:57%;} 58%{left:-157px; top:58%;} 59%{left:-148px; top:59%;} 60%{left:-138px; top:60%;} 61%{left:-129px; top:61%;} 62%{left:-119px; top:62%;} 63%{left:-109px; top:63%;} 64%{left:-99px; top:64%;} 65%{left:-89px; top:65%;} 66%{left:-79px; top:66%;} 67%{left:-70px; top:67%;} 68%{left:-61px; top:68%;} 69%{left:-53px; top:69%;} 70%{left:-45px; top:70%;} 71%{left:-38px; top:71%;} 72%{left:-31px; top:72%;} 73%{left:-25px; top:73%;} 74%{left:-21px; top:74%;} 75%{left:-17px; top:75%;} 76%{left:-14px; top:76%;} 77%{left:-12px; top:77%;} 78%{left:-11px; top:78%;} 79%{left:-11px; top:79%;} 80%{left:-12px; top:80%;} 81%{left:-14px; top:81%;} 82%{left:-16px; top:82%;} 83%{left:-20px; top:83%;} 84%{left:-25px; top:84%;} 85%{left:-31px; top:85%;} 86%{left:-37px; top:86%;} 87%{left:-44px; top:87%;} 88%{left:-52px; top:88%;} 89%{left:-60px; top:89%;} 90%{left:-69px; top:90%;} 91%{left:-79px; top:91%;} 92%{left:-88px; top:92%;} 93%{left:-98px; top:93%;} 94%{left:-108px; top:94%;} 95%{left:-118px; top:95%;} 96%{left:-128px; top:96%;} 97%{left:-138px; top:97%;} 98%{left:-147px; top:98%;} 99%{left:-156px; top:99%;} 100%{left:-165px; top:100%;} }</style><span style="left:110vw;"><div style="animation-delay:15.1s;"></div></span><span style="left:100vw;"><div style="animation-delay:19.2s;"></div></span><span style="left:90vw;"><div style="animation-delay:11.6s;"></div></span><span style="left:80vw;"><div style="animation-delay:12.3s;"></div></span><span style="left:70vw;"><div style="animation-delay:17.5s;"></div></span><span style="left:60vw;"><div style="animation-delay:13.9s;"></div></span><span style="left:50vw;"><div style="animation-delay:13.5s;"></div></span><span style="left:40vw;"><div style="animation-delay:14.5s;"></div></span><span style="left:30vw;"><div style="animation-delay:11s;"></div></span><span style="left:20vw;"><div style="animation-delay:14.4s;"></div></span><span style="left:10vw;"><div style="animation-delay:3.6s;"></div></span><span style="left:0vw;"><div style="animation-delay:3.2s;"></div></span><span style="left:-10vw;"><div style="animation-delay:14.3s;"></div></span></section>
comrade
demo
clone
id: 2559784886
source: (triple click to highlight all)
<section id="snowflakes2559784886"><!--snowflakes(v1) generated with: https://snowfallgarden.lophius.xyz--><style>#snowflakes2559784886 { overflow:hidden; pointer-events:none; image-rendering:pixelated; } #snowflakes2559784886 > span { position:fixed; top:-65px; height:calc(100vh + 65px); } #snowflakes2559784886 span div { width:65px; height:65px; position:relative; background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEEAAABBCAYAAACO98lFAAABv0lEQVR4Xu2YwRLCIAxE63d48eD/f5EHL36HDtOpwzBANpSkqa5XWwiP3SX0svC3XMhgIYQkAiqBENYwoBIIgUr4Hoy0A+1AO9AOeafMTGAmMBNiZcLzen+Xt9nb6+FmVbeJpCv7kSDCQEiQjgIRCsKmFm8YISHUVGGZEWEheIIIDaEEYaUGQjhDx5iH5N8qwcMS4e3wFxDKnqAmeeQZqSPt/X+oEjRNkWU2uEOoLXzbpV7w/QyEUQDWueCmhD0AyjvF7KPSBUIPQFoguqhtHPR5NCzNIUgACCHbKml3Tx+MraNQc/6fHkLPmwgISwCpNvNMQMJJWqT0PzJH2I4xL6ylCEQpPwOh9aHV41P8sB2sJDqjqdIqYwiC5uKjLainCOkYHZlrKBil5mdPodLYmsZKA0SlhJoFpMIlKNL7oTKhlwHahaC7lACGOR2QQmaDyBVkdXHaNkO0AwKgvOqiO117TrLPnrFb76ogaArUKkMz9mwQXQizeoEWkCMXnoOEIEQpdrYC4EywmjjSuGImRCrWqhZCiPI9wWqH0XGpBCph1QqVQAhUwjc3aQfagXagHeBbJNpxnf05BiODcdXwB8CT7EIqMykaAAAAAElFTkSuQmCC); animation: sine 15s linear 0s infinite normal;} @keyframes sine { 0%{left:-110px; top:0%;} 1%{left:-101px; top:1%;} 2%{left:-91px; top:2%;} 3%{left:-81px; top:3%;} 4%{left:-72px; top:4%;} 5%{left:-63px; top:5%;} 6%{left:-54px; top:6%;} 7%{left:-46px; top:7%;} 8%{left:-39px; top:8%;} 9%{left:-32px; top:9%;} 10%{left:-26px; top:10%;} 11%{left:-21px; top:11%;} 12%{left:-17px; top:12%;} 13%{left:-14px; top:13%;} 14%{left:-12px; top:14%;} 15%{left:-11px; top:15%;} 16%{left:-11px; top:16%;} 17%{left:-11px; top:17%;} 18%{left:-13px; top:18%;} 19%{left:-16px; top:19%;} 20%{left:-20px; top:20%;} 21%{left:-24px; top:21%;} 22%{left:-30px; top:22%;} 23%{left:-36px; top:23%;} 24%{left:-43px; top:24%;} 25%{left:-51px; top:25%;} 26%{left:-59px; top:26%;} 27%{left:-68px; top:27%;} 28%{left:-77px; top:28%;} 29%{left:-87px; top:29%;} 30%{left:-96px; top:30%;} 31%{left:-106px; top:31%;} 32%{left:-116px; top:32%;} 33%{left:-126px; top:33%;} 34%{left:-136px; top:34%;} 35%{left:-146px; top:35%;} 36%{left:-155px; top:36%;} 37%{left:-163px; top:37%;} 38%{left:-172px; top:38%;} 39%{left:-179px; top:39%;} 40%{left:-186px; top:40%;} 41%{left:-192px; top:41%;} 42%{left:-198px; top:42%;} 43%{left:-202px; top:43%;} 44%{left:-206px; top:44%;} 45%{left:-208px; top:45%;} 46%{left:-210px; top:46%;} 47%{left:-210px; top:47%;} 48%{left:-210px; top:48%;} 49%{left:-209px; top:49%;} 50%{left:-206px; top:50%;} 51%{left:-203px; top:51%;} 52%{left:-199px; top:52%;} 53%{left:-194px; top:53%;} 54%{left:-188px; top:54%;} 55%{left:-181px; top:55%;} 56%{left:-174px; top:56%;} 57%{left:-166px; top:57%;} 58%{left:-157px; top:58%;} 59%{left:-148px; top:59%;} 60%{left:-138px; top:60%;} 61%{left:-129px; top:61%;} 62%{left:-119px; top:62%;} 63%{left:-109px; top:63%;} 64%{left:-99px; top:64%;} 65%{left:-89px; top:65%;} 66%{left:-79px; top:66%;} 67%{left:-70px; top:67%;} 68%{left:-61px; top:68%;} 69%{left:-53px; top:69%;} 70%{left:-45px; top:70%;} 71%{left:-38px; top:71%;} 72%{left:-31px; top:72%;} 73%{left:-25px; top:73%;} 74%{left:-21px; top:74%;} 75%{left:-17px; top:75%;} 76%{left:-14px; top:76%;} 77%{left:-12px; top:77%;} 78%{left:-11px; top:78%;} 79%{left:-11px; top:79%;} 80%{left:-12px; top:80%;} 81%{left:-14px; top:81%;} 82%{left:-16px; top:82%;} 83%{left:-20px; top:83%;} 84%{left:-25px; top:84%;} 85%{left:-31px; top:85%;} 86%{left:-37px; top:86%;} 87%{left:-44px; top:87%;} 88%{left:-52px; top:88%;} 89%{left:-60px; top:89%;} 90%{left:-69px; top:90%;} 91%{left:-79px; top:91%;} 92%{left:-88px; top:92%;} 93%{left:-98px; top:93%;} 94%{left:-108px; top:94%;} 95%{left:-118px; top:95%;} 96%{left:-128px; top:96%;} 97%{left:-138px; top:97%;} 98%{left:-147px; top:98%;} 99%{left:-156px; top:99%;} 100%{left:-165px; top:100%;} }</style><span style="left:110vw;"><div style="animation-delay:6.7s;"></div></span><span style="left:100vw;"><div style="animation-delay:6.3s;"></div></span><span style="left:90vw;"><div style="animation-delay:13.4s;"></div></span><span style="left:80vw;"><div style="animation-delay:8s;"></div></span><span style="left:70vw;"><div style="animation-delay:18.8s;"></div></span><span style="left:60vw;"><div style="animation-delay:10.7s;"></div></span><span style="left:50vw;"><div style="animation-delay:15s;"></div></span><span style="left:40vw;"><div style="animation-delay:2.3s;"></div></span><span style="left:30vw;"><div style="animation-delay:10.3s;"></div></span><span style="left:20vw;"><div style="animation-delay:8.5s;"></div></span><span style="left:10vw;"><div style="animation-delay:4.2s;"></div></span><span style="left:0vw;"><div style="animation-delay:6.1s;"></div></span><span style="left:-10vw;"><div style="animation-delay:15.2s;"></div></span></section>
Frugal Gamer
https://thefrugalgamer.net
demo
clone
id: 3369645720
I tried to make the classic paper-cut type snowflake. Love this tool!
source: (triple click to highlight all)
<section id="snowflakes3369645720"><!--snowflakes(v1) generated with: https://snowfallgarden.lophius.xyz--><style>#snowflakes3369645720 { overflow:hidden; pointer-events:none; image-rendering:pixelated; } #snowflakes3369645720 > span { position:fixed; top:-65px; height:calc(100vh + 65px); } #snowflakes3369645720 span div { width:65px; height:65px; position:relative; background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEEAAABBCAYAAACO98lFAAAAAXNSR0IArs4c6QAABuhJREFUeF7dWu2S3CAM6977v3KvjQEHI+QPknY60/3T3gaMLWTZkP38KH0+16hfhZHxuF/X53N9MkNzHLNX9SVbZTy/zKUOFU31Ya5/NcdrozKPzq1sIJRNlAaWBmVRxc8fLaFhd3a/ZsIjH6pho/FgsTd+vAYhisdqgP5f/m3oE22wz9jcP0EJT2Wq+5KOywKsiKIu4omou8YLKtxMeGFjAafqvAbTJgs3RKUHOx6D+TCIVq+W4iffdMb6HzsJDERlEFNC08ICIkB8X198OaW0WmZT2uoALJEPgUzXw53ddlpwvyK3WhGxIazG1Js4slQY+fRDuHT4+JcF2L67YPhcFDgPMt2HlNh0wNu8rKTFuvDnysJvt6OspEFVjzDgkAmuUaEuzLTKfwMouwrykoFbKZ+2gsyAurp2P1amZgCm6fCEaCh0zcbwKxK9ViiuD5ZSas845qWs7ED1xPMkTnfOHcTYj28ieFG/gE0SMiPb1SfBdCYUda7SqGxOGuUf7UCjLI5j5ZOlRgSChCFM81LKA+goHSwt1SBqQfvbVAH6fNBenWUl1JvHUibzKysNZRAqyptRle2+NEWye1HQGASyRucK+qoCzBeP8OWajEZXg728ZTRkIISMcrawgSZZbFiHAWYbYk3vbTNdeK/hDNW2MCmLatJTflYNauLpi1kdhJ69pY8YFerGJee84akCEwHJAqiDULhU8fLPQ86rIKjc1q6wR84Oeni6qT4W0f12qxM4Y8dVwCBM8LutEyfssfhU6aOKkt1JWB8V+GwOTYcMyQxdf76ky89rx7/aura0qaPYUZ4wMUqtaANdTehqr734Tn406im/Nka2J1h3Wg5NHZQOTP/b2l+qwT1ultU9wJ3NUeWaIDzsGiNnLTC4owgKsmKfq+zpfXgT6evT7IyK1P++znYG1IrqDxBiBKyDDFG7UxFDGLXlO22YGFuaYI47BrWN422gma8MlFKJrAgi20l/t6Wv+9y7aVNGnbTni0VjBuJYQe7g2n7Wmrd7La/Gsh3PBHHm9bykxMOSZQMGGo3V/sS7e0Q2eMfxrVJcoC1MqFApZYXJLGbPy32PSZYZWX5HvkWxldIBF7eL7WrC9QWDFPx7BbI3QrxstvUT4U43J0AQQOClxZvP8pYKj1Hy/nwGzqoG6sKdZgOLSDciX7dnI9y7OuBVlDhnL0Ge5hzqiFYDzXH2PDtWr7s+N45p1s5AG0mf6zKhKoJWDPf2dD9Q3XYdemegxOv5nPfiaVXGm7YiKI3KPD9GiGfH4ixI+9zr/b38P2dCjz4URlRUBOyxJph3jyea8HT9rItsIBQ75tsHX4l9Syw39XzSfJBbIsnQLkV9h9p3Ne+ys46fKE/7BPO6LDLOajMGiQcmDT6q61kKs6Mzt0eFsaPSr633g8j3Vde/CoeTPdD1xBd1ijavWap4dwOWL1iBLMPY/FKz5NN/7gkL3O7qPB9o4e101/sDjzXsKL6mC+eF5zNLrhiEMWM6uHZ3urxdEBfHU6B3v4A2rEagXqANC0MljRCIEhPYIhXHGLX12M1ZMgVRtUKpXF3PiuxWTUR4CXH8PmF4G/1iBFUdO732fFyiYtAj3Pt1vO4O6kDb9fEW3Osks3Tdn69coCB41LT09wQKRQgbGGQH5rc3PgtED2ResxYBtYMACcOcjgBg9I3OAlYzcG5oK2i7kaHZ+5JUExg9l7QioHl5yRhm7UeCtzJsbeMxzds6o5fp9uPxeUdmKkTGALaTKKrZ2eKJDVYkMa14IVVlip6aZxWj2Rj2nH+3XsOznd42JEjjLUQYm6bDLYbj1pfVWCk7mUJ7+Y7CmDEBhZftoXf69PY7T4cxc9sxaKTs+0RvsUj5I/H0mBABn7HS2iy+mu9TsBtDAbyV3tERr9JgMG2cecUfldmKX1nGF9OhR/WE8sxJe4C6062puLxV6q//WJqUUoU0VlP++A8L+mpOzc0QZIKjr9hncPOdZiVXPbZgRzlByn+KncVRZEJmZgXSpk2lJNp98CqIx4yCZ+mQEARPXFJtkGZFcLk+TNSWZ4aFe7rNn2KxVMz8wFTz0PAPUCYQzJaK8s4xOnta2Z919yK7Z2uu4WZalqZDWS7KA3lPkTmacvrOl/Gfyu95x9D7h5frIk5EB4Fae6wEYrpUxpSBOByYMuHMXu3Xayic7G96Trm8xeoz/ZO+b7zaPHO69hO+EwJkYoo3RNZfdnvEhBUBOvFvx+fgd4w+uKvg6U9pKs5HG1YF00rBgQwsS//hdFhdsoHodX0kgPYZNk3uMf4dDZrDfwmEw6R8OfwtDqImUqFfuvHvp/consXyXzDh7RYkIDBkn6Etjla6vpNxJRYX3P0N4nsowTHUiDcAAAAASUVORK5CYII=); animation: sine 15s linear 0s infinite normal;} @keyframes sine { 0%{left:-110px; top:0%;} 1%{left:-101px; top:1%;} 2%{left:-91px; top:2%;} 3%{left:-81px; top:3%;} 4%{left:-72px; top:4%;} 5%{left:-63px; top:5%;} 6%{left:-54px; top:6%;} 7%{left:-46px; top:7%;} 8%{left:-39px; top:8%;} 9%{left:-32px; top:9%;} 10%{left:-26px; top:10%;} 11%{left:-21px; top:11%;} 12%{left:-17px; top:12%;} 13%{left:-14px; top:13%;} 14%{left:-12px; top:14%;} 15%{left:-11px; top:15%;} 16%{left:-11px; top:16%;} 17%{left:-11px; top:17%;} 18%{left:-13px; top:18%;} 19%{left:-16px; top:19%;} 20%{left:-20px; top:20%;} 21%{left:-24px; top:21%;} 22%{left:-30px; top:22%;} 23%{left:-36px; top:23%;} 24%{left:-43px; top:24%;} 25%{left:-51px; top:25%;} 26%{left:-59px; top:26%;} 27%{left:-68px; top:27%;} 28%{left:-77px; top:28%;} 29%{left:-87px; top:29%;} 30%{left:-96px; top:30%;} 31%{left:-106px; top:31%;} 32%{left:-116px; top:32%;} 33%{left:-126px; top:33%;} 34%{left:-136px; top:34%;} 35%{left:-146px; top:35%;} 36%{left:-155px; top:36%;} 37%{left:-163px; top:37%;} 38%{left:-172px; top:38%;} 39%{left:-179px; top:39%;} 40%{left:-186px; top:40%;} 41%{left:-192px; top:41%;} 42%{left:-198px; top:42%;} 43%{left:-202px; top:43%;} 44%{left:-206px; top:44%;} 45%{left:-208px; top:45%;} 46%{left:-210px; top:46%;} 47%{left:-210px; top:47%;} 48%{left:-210px; top:48%;} 49%{left:-209px; top:49%;} 50%{left:-206px; top:50%;} 51%{left:-203px; top:51%;} 52%{left:-199px; top:52%;} 53%{left:-194px; top:53%;} 54%{left:-188px; top:54%;} 55%{left:-181px; top:55%;} 56%{left:-174px; top:56%;} 57%{left:-166px; top:57%;} 58%{left:-157px; top:58%;} 59%{left:-148px; top:59%;} 60%{left:-138px; top:60%;} 61%{left:-129px; top:61%;} 62%{left:-119px; top:62%;} 63%{left:-109px; top:63%;} 64%{left:-99px; top:64%;} 65%{left:-89px; top:65%;} 66%{left:-79px; top:66%;} 67%{left:-70px; top:67%;} 68%{left:-61px; top:68%;} 69%{left:-53px; top:69%;} 70%{left:-45px; top:70%;} 71%{left:-38px; top:71%;} 72%{left:-31px; top:72%;} 73%{left:-25px; top:73%;} 74%{left:-21px; top:74%;} 75%{left:-17px; top:75%;} 76%{left:-14px; top:76%;} 77%{left:-12px; top:77%;} 78%{left:-11px; top:78%;} 79%{left:-11px; top:79%;} 80%{left:-12px; top:80%;} 81%{left:-14px; top:81%;} 82%{left:-16px; top:82%;} 83%{left:-20px; top:83%;} 84%{left:-25px; top:84%;} 85%{left:-31px; top:85%;} 86%{left:-37px; top:86%;} 87%{left:-44px; top:87%;} 88%{left:-52px; top:88%;} 89%{left:-60px; top:89%;} 90%{left:-69px; top:90%;} 91%{left:-79px; top:91%;} 92%{left:-88px; top:92%;} 93%{left:-98px; top:93%;} 94%{left:-108px; top:94%;} 95%{left:-118px; top:95%;} 96%{left:-128px; top:96%;} 97%{left:-138px; top:97%;} 98%{left:-147px; top:98%;} 99%{left:-156px; top:99%;} 100%{left:-165px; top:100%;} }</style><span style="left:110vw;"><div style="animation-delay:10s;"></div></span><span style="left:100vw;"><div style="animation-delay:9.3s;"></div></span><span style="left:90vw;"><div style="animation-delay:15.8s;"></div></span><span style="left:80vw;"><div style="animation-delay:1.4s;"></div></span><span style="left:70vw;"><div style="animation-delay:16.2s;"></div></span><span style="left:60vw;"><div style="animation-delay:0.7s;"></div></span><span style="left:50vw;"><div style="animation-delay:16.1s;"></div></span><span style="left:40vw;"><div style="animation-delay:14.9s;"></div></span><span style="left:30vw;"><div style="animation-delay:16.5s;"></div></span><span style="left:20vw;"><div style="animation-delay:13.9s;"></div></span><span style="left:10vw;"><div style="animation-delay:19.6s;"></div></span><span style="left:0vw;"><div style="animation-delay:11.2s;"></div></span><span style="left:-10vw;"><div style="animation-delay:3.2s;"></div></span></section>
Nico
demo
clone
id: 1668273258
This is very cool!
source: (triple click to highlight all)
<section id="snowflakes1668273258"><!--snowflakes(v1) generated with: https://snowfallgarden.lophius.xyz--><style>#snowflakes1668273258 { overflow:hidden; pointer-events:none; image-rendering:pixelated; } #snowflakes1668273258 > span { position:fixed; top:-65px; height:calc(100vh + 65px); } #snowflakes1668273258 span div { width:65px; height:65px; position:relative; background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEEAAABBCAYAAACO98lFAAAFjUlEQVR4Xu1bi5LbMAhM/qx/1vTP+mdXSxG6FQIWycn1pvXNdKbxA8GyLFhx7jfn7+P4K6fux593zSuOl3W+Yo0oljDAdwIhthHId4CRiYFmuRtR3u6yAIMvQQsT9PFd+7fG4HJ/pXKCzRSEYnQwBouUWll1VmcGyyGTNXc95deQPOInD6IYbxkbUMVF24kMIFoD2OfQpuPDAGbzP7ITgyCLNCTdTGlnAlBY0KFQJtaZfFQxWGBwEBSVUpQNWDIE2YxVJwDoQSAXGBcmKSiJZRCq4DTHUmqugij6gouyz6JsrNRCn0hJbIEgQKRAQO9Z5o3zLHg5T8toiwmklpbYAJGc0gQHEeoLiaX36cl+QlXp4sqodb0FSqa3IwNS1zvx1PV3xWTVCW8di8ZZcLPXVV8NEPr9ptAR+mjWRM7IOS9bXi1n7ksxALKFIos+d2EcnEmUQgYIqtglQdgtDPHySmgJAATCaMUDCN3wBgiaURXUZtDUm3augx+xryEhzxpbAEBJaGCHFskomGlXgw28QbKsgp0YiMDJtY0xYm65NbcbvfjMOWFJcCDQUGQtQJ56Ne4nQOBYw6tCnCnXDupw8SbylEEO1cP7gvKg6xmJqQRzEvF5nDjqUZCyhtkFqk9rRDrRWBTpA2VmK9E7bkJ4+wOesV0ARESnZwhrtN0EIu1bZUhZJLE5gkap+IkSe91BtABpW5zx/LCACEqXAoBlUTSpM2EBCJOCWtAcADwAZffKpXfC/opWVByazScjN9ig1ReNRswyuwEkYDpvyLzVNba6R4v7EwRC3d5OViirAjBpqhKQonJSJyLRxAoYu0NybJ1YQJwSIXTL6MzuVVDGIaAAftgiuxGMWi96BoCgFE8xwhBNc8uut0illLizPGUOxakYSNIyHHOJHlEw0AftX4ttEky15jg2w9XUcRAJSyRTLDLV9dPzLnbtP7SFBro2lKS6zn6KjJyD1rI0XLEWR84vMYL4r21VEOgC0H+6/UBEs6q8KrB0DnDKIWSq0Iv25t3s69UNDXncHh/HP/oMo6Qr/sY8IdaS/IJB32OMGFTBcgRsyA6pSb3G4zB6u/06Dv+8PY7aYlXYz+Oix0FTK5q/6lJzieduc7A6jrPeZSnvVfkUBhR7jx/Hv99PywMjkH1v9K9u76WQ+teZgLUR0vFVM4EqmW+hCQJCqOiCDlFfqt5MYJNAu76e6Q5LQLBAjvNmy/3uc4Kluv/lxFiBMNqK+eAhdZ2kLwV090lQs/L0s4MRUGr+Twwm4URK5g8KoBLansxGb/PlLeXztZ9Q5oQBOYeWp1VfstIyMJWY2l6jnSpZhqEdsHHtMfZnAquujMkpZARrgYoNdUlY4+/uNjvCpDFAcZsemuRiLKcEZVNfvnhzCYCuAQyF2Ajs+gZqYKSTOYYqO+/tQ2L7dd9BTrApEj/XN7dFIu3K3AS0CXs1jMmuQwRg874AgFS3IhqEW4PX+wlKoPGF9u0fe1DRVBku13em6ewH4mc0L3rIY9D1zhIyYcpI8FBjQW6JUCiaLcvf5u21yVmiytEM4Z3zRHMAH4cnKAVLmGlXMhyph1py8f7rjdaCi5eJzDsLq9nwSgYz/QqbpkIWZjlfGPm75ScHFU+qNejsM5V8mFPod5WOzl2/d9BzwoR6QKFoXB3sgMDVoVQtyj6jmEWsoJ0o6HbLTEjVrAoca1G34g4CqLa7rwnqnm3T9TonmWKDg+C0lSjbUfaYBrhCLcHo6FWGd9o9/xqxoega73DmvlA9BYLX+5UPg6+EBTXHVH3F4nPOSO0/rNQugpIqtaDt9FPwbbv7cwOwQ0HojuHiiyM13gqYVlAFBH2cJicBxkt+K30qMyQKDBrYTJOyCk4mBnfRzM2rDnmKzjZtzq7DYvkDeVIvffj1YGIAAAAASUVORK5CYII=); animation: sine 15s linear 0s infinite normal;} @keyframes sine { 0%{left:-110px; top:0%;} 1%{left:-101px; top:1%;} 2%{left:-91px; top:2%;} 3%{left:-81px; top:3%;} 4%{left:-72px; top:4%;} 5%{left:-63px; top:5%;} 6%{left:-54px; top:6%;} 7%{left:-46px; top:7%;} 8%{left:-39px; top:8%;} 9%{left:-32px; top:9%;} 10%{left:-26px; top:10%;} 11%{left:-21px; top:11%;} 12%{left:-17px; top:12%;} 13%{left:-14px; top:13%;} 14%{left:-12px; top:14%;} 15%{left:-11px; top:15%;} 16%{left:-11px; top:16%;} 17%{left:-11px; top:17%;} 18%{left:-13px; top:18%;} 19%{left:-16px; top:19%;} 20%{left:-20px; top:20%;} 21%{left:-24px; top:21%;} 22%{left:-30px; top:22%;} 23%{left:-36px; top:23%;} 24%{left:-43px; top:24%;} 25%{left:-51px; top:25%;} 26%{left:-59px; top:26%;} 27%{left:-68px; top:27%;} 28%{left:-77px; top:28%;} 29%{left:-87px; top:29%;} 30%{left:-96px; top:30%;} 31%{left:-106px; top:31%;} 32%{left:-116px; top:32%;} 33%{left:-126px; top:33%;} 34%{left:-136px; top:34%;} 35%{left:-146px; top:35%;} 36%{left:-155px; top:36%;} 37%{left:-163px; top:37%;} 38%{left:-172px; top:38%;} 39%{left:-179px; top:39%;} 40%{left:-186px; top:40%;} 41%{left:-192px; top:41%;} 42%{left:-198px; top:42%;} 43%{left:-202px; top:43%;} 44%{left:-206px; top:44%;} 45%{left:-208px; top:45%;} 46%{left:-210px; top:46%;} 47%{left:-210px; top:47%;} 48%{left:-210px; top:48%;} 49%{left:-209px; top:49%;} 50%{left:-206px; top:50%;} 51%{left:-203px; top:51%;} 52%{left:-199px; top:52%;} 53%{left:-194px; top:53%;} 54%{left:-188px; top:54%;} 55%{left:-181px; top:55%;} 56%{left:-174px; top:56%;} 57%{left:-166px; top:57%;} 58%{left:-157px; top:58%;} 59%{left:-148px; top:59%;} 60%{left:-138px; top:60%;} 61%{left:-129px; top:61%;} 62%{left:-119px; top:62%;} 63%{left:-109px; top:63%;} 64%{left:-99px; top:64%;} 65%{left:-89px; top:65%;} 66%{left:-79px; top:66%;} 67%{left:-70px; top:67%;} 68%{left:-61px; top:68%;} 69%{left:-53px; top:69%;} 70%{left:-45px; top:70%;} 71%{left:-38px; top:71%;} 72%{left:-31px; top:72%;} 73%{left:-25px; top:73%;} 74%{left:-21px; top:74%;} 75%{left:-17px; top:75%;} 76%{left:-14px; top:76%;} 77%{left:-12px; top:77%;} 78%{left:-11px; top:78%;} 79%{left:-11px; top:79%;} 80%{left:-12px; top:80%;} 81%{left:-14px; top:81%;} 82%{left:-16px; top:82%;} 83%{left:-20px; top:83%;} 84%{left:-25px; top:84%;} 85%{left:-31px; top:85%;} 86%{left:-37px; top:86%;} 87%{left:-44px; top:87%;} 88%{left:-52px; top:88%;} 89%{left:-60px; top:89%;} 90%{left:-69px; top:90%;} 91%{left:-79px; top:91%;} 92%{left:-88px; top:92%;} 93%{left:-98px; top:93%;} 94%{left:-108px; top:94%;} 95%{left:-118px; top:95%;} 96%{left:-128px; top:96%;} 97%{left:-138px; top:97%;} 98%{left:-147px; top:98%;} 99%{left:-156px; top:99%;} 100%{left:-165px; top:100%;} }</style><span style="left:110vw;"><div style="animation-delay:12.7s;"></div></span><span style="left:100vw;"><div style="animation-delay:0.7s;"></div></span><span style="left:90vw;"><div style="animation-delay:10s;"></div></span><span style="left:80vw;"><div style="animation-delay:19.6s;"></div></span><span style="left:70vw;"><div style="animation-delay:10s;"></div></span><span style="left:60vw;"><div style="animation-delay:2.9s;"></div></span><span style="left:50vw;"><div style="animation-delay:8.4s;"></div></span><span style="left:40vw;"><div style="animation-delay:10.7s;"></div></span><span style="left:30vw;"><div style="animation-delay:17s;"></div></span><span style="left:20vw;"><div style="animation-delay:12.6s;"></div></span><span style="left:10vw;"><div style="animation-delay:15.2s;"></div></span><span style="left:0vw;"><div style="animation-delay:3.5s;"></div></span><span style="left:-10vw;"><div style="animation-delay:16s;"></div></span></section>
sacha
https://snowfallgarden.lophius.xyz
demo
clone
id: 3038001491
the first ever snowflake
source: (triple click to highlight all)
<section id="snowflakes3038001491"><!--snowflakes(v1) generated with: https://snowfallgarden.lophius.xyz--><style>#snowflakes3038001491 { overflow:hidden; pointer-events:none; image-rendering:pixelated; } #snowflakes3038001491 > span { position:fixed; top:-16px; height:calc(100vh + 16px); } #snowflakes3038001491 span div { width:16px; height:16px; position:relative; background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAfklEQVQ4T61TQQ7AIAib/3/0JkRMxyqQMC5GoQWKjIvYPU2exzQ5/R0hGhCRmM/IfOyLIMvMKtkE5oxKZzGUwEgwI4IxyRAH9ucDPz0vYU1cJUBGVD0DK64COFUllfcJ2i20RTSh2JhKY2QEpx0IPxJbmuxr7zH+tky+nco6P9NhoAE7XQvlAAAAAElFTkSuQmCC); animation: sine 15s linear 0s infinite normal;} @keyframes sine { 0%{left:-110px; top:0%;} 1%{left:-101px; top:1%;} 2%{left:-91px; top:2%;} 3%{left:-81px; top:3%;} 4%{left:-72px; top:4%;} 5%{left:-63px; top:5%;} 6%{left:-54px; top:6%;} 7%{left:-46px; top:7%;} 8%{left:-39px; top:8%;} 9%{left:-32px; top:9%;} 10%{left:-26px; top:10%;} 11%{left:-21px; top:11%;} 12%{left:-17px; top:12%;} 13%{left:-14px; top:13%;} 14%{left:-12px; top:14%;} 15%{left:-11px; top:15%;} 16%{left:-11px; top:16%;} 17%{left:-11px; top:17%;} 18%{left:-13px; top:18%;} 19%{left:-16px; top:19%;} 20%{left:-20px; top:20%;} 21%{left:-24px; top:21%;} 22%{left:-30px; top:22%;} 23%{left:-36px; top:23%;} 24%{left:-43px; top:24%;} 25%{left:-51px; top:25%;} 26%{left:-59px; top:26%;} 27%{left:-68px; top:27%;} 28%{left:-77px; top:28%;} 29%{left:-87px; top:29%;} 30%{left:-96px; top:30%;} 31%{left:-106px; top:31%;} 32%{left:-116px; top:32%;} 33%{left:-126px; top:33%;} 34%{left:-136px; top:34%;} 35%{left:-146px; top:35%;} 36%{left:-155px; top:36%;} 37%{left:-163px; top:37%;} 38%{left:-172px; top:38%;} 39%{left:-179px; top:39%;} 40%{left:-186px; top:40%;} 41%{left:-192px; top:41%;} 42%{left:-198px; top:42%;} 43%{left:-202px; top:43%;} 44%{left:-206px; top:44%;} 45%{left:-208px; top:45%;} 46%{left:-210px; top:46%;} 47%{left:-210px; top:47%;} 48%{left:-210px; top:48%;} 49%{left:-209px; top:49%;} 50%{left:-206px; top:50%;} 51%{left:-203px; top:51%;} 52%{left:-199px; top:52%;} 53%{left:-194px; top:53%;} 54%{left:-188px; top:54%;} 55%{left:-181px; top:55%;} 56%{left:-174px; top:56%;} 57%{left:-166px; top:57%;} 58%{left:-157px; top:58%;} 59%{left:-148px; top:59%;} 60%{left:-138px; top:60%;} 61%{left:-129px; top:61%;} 62%{left:-119px; top:62%;} 63%{left:-109px; top:63%;} 64%{left:-99px; top:64%;} 65%{left:-89px; top:65%;} 66%{left:-79px; top:66%;} 67%{left:-70px; top:67%;} 68%{left:-61px; top:68%;} 69%{left:-53px; top:69%;} 70%{left:-45px; top:70%;} 71%{left:-38px; top:71%;} 72%{left:-31px; top:72%;} 73%{left:-25px; top:73%;} 74%{left:-21px; top:74%;} 75%{left:-17px; top:75%;} 76%{left:-14px; top:76%;} 77%{left:-12px; top:77%;} 78%{left:-11px; top:78%;} 79%{left:-11px; top:79%;} 80%{left:-12px; top:80%;} 81%{left:-14px; top:81%;} 82%{left:-16px; top:82%;} 83%{left:-20px; top:83%;} 84%{left:-25px; top:84%;} 85%{left:-31px; top:85%;} 86%{left:-37px; top:86%;} 87%{left:-44px; top:87%;} 88%{left:-52px; top:88%;} 89%{left:-60px; top:89%;} 90%{left:-69px; top:90%;} 91%{left:-79px; top:91%;} 92%{left:-88px; top:92%;} 93%{left:-98px; top:93%;} 94%{left:-108px; top:94%;} 95%{left:-118px; top:95%;} 96%{left:-128px; top:96%;} 97%{left:-138px; top:97%;} 98%{left:-147px; top:98%;} 99%{left:-156px; top:99%;} 100%{left:-165px; top:100%;} }</style><span style="left:110vw;"><div style="animation-delay:3.8s;"></div></span><span style="left:100vw;"><div style="animation-delay:2.8s;"></div></span><span style="left:90vw;"><div style="animation-delay:10.4s;"></div></span><span style="left:80vw;"><div style="animation-delay:2.7s;"></div></span><span style="left:70vw;"><div style="animation-delay:15.9s;"></div></span><span style="left:60vw;"><div style="animation-delay:8.7s;"></div></span><span style="left:50vw;"><div style="animation-delay:6.6s;"></div></span><span style="left:40vw;"><div style="animation-delay:7s;"></div></span><span style="left:30vw;"><div style="animation-delay:12.8s;"></div></span><span style="left:20vw;"><div style="animation-delay:13.1s;"></div></span><span style="left:10vw;"><div style="animation-delay:5.1s;"></div></span><span style="left:0vw;"><div style="animation-delay:18.5s;"></div></span><span style="left:-10vw;"><div style="animation-delay:11.8s;"></div></span></section>