space pew pew
✨ SUPACHAI KHEAWJUY
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Space pew pew</title> <link rel="icon" type="image/png" href="https://raw.githubusercontent.com/spicyz/space-pew-pew/main/jupiter.png"> </head> <style> body, html{ margin: 0; height: 100%; overflow: hidden; } .bg{ height: 100%; width: 100%; background: black; /* background-image: radial-gradient(circle at 100% 100%, #234465, #050c14); */ /* background-repeat: no-repeat; */ } .duangdow, .kaprib{ position: absolute; width:100%; height:100%; } .duangdow{ background: url("https://raw.githubusercontent.com/spicyz/space-pew-pew/main/stars.png"); } .duangdow:nth-child(2){ scale: 2; position: absolute; z-index: 1; animation: dow-loen 150s linear infinite; } .kaprib{ background: transparent url("https://raw.githubusercontent.com/spicyz/space-pew-pew/main/kaprib.png") repeat top center; z-index: 2; animation: make-kaprib 200s linear infinite; } .jaruad{ z-index: 4; position: absolute; left: 0; bottom: 0; width: 128px; height: 128px; /* scale: 0.2; */ animation: jaruad-poong 4.5s cubic-bezier(.66,.05,.54,1.07) infinite; } .ukkabad{ z-index: 3; position: absolute; left: 0; top: 0; width: 128px; height: 128px; animation: ukkabad-tok 3s linear infinite; } @keyframes dow-loen { from {left: -50%;} to {left: 60%;} } @keyframes jaruad-poong{ from { left: -256px; bottom: -256px; width: 256px; height: 256px; } to { left: 100%; bottom: 100%; width: 64px; height: 64px; } } @keyframes ukkabad-tok{ from { left: 0; top: 0; width: 128px; height: 128px; } to { left: 100%; top: 100%; width: 512px; height: 512px; } } @keyframes make-kaprib { from {background-position:0 0;} to {background-position:-10000px 5000px;} } </style> <body> <div class="bg" id="backgroundngai"> <div class="duangdow"></div> <div class="duangdow"></div> <div class="kaprib"></div> <img src="https://cdn.discordapp.com/attachments/808985405533847562/809012580177412126/rocket.png" class="jaruad" alt=""> <img src="https://cdn.discordapp.com/attachments/808985405533847562/809012586431512636/meteor.png" class="ukkabad" alt=""> </div> </body> <script> </script> </html>