WEBLEB
Home
Editor
Accedi
Pro
Italiano
English
Français
Español
Português
Deutsch
Italiano
हिंदी
Caricatore luminoso
1193
ledoc
Apri nell'Editor
Pubblica il Tuo Codice
Consigliato
19 November 2024
Collegamento al passaggio del mouse
29 August 2024
29 November 2024
Un codice di efficientapp58
HTML
Copy
<html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Pure CSS 3D Glowing Loader Animation</title> <link rel="stylesheet" href="style.css"> </head> <body> <div class="loader"> <div class="round">Loading</div> </div> </body> </html>
CSS
Copy
body { display: flex; justify-content: center; align-items: center; height: 100vh; margin: 0; background-color: #021514; } .loader { perspective: 800px; } .round { position: relative; width: 200px; height: 200px; border-radius: 50%; animation: animate 4s linear infinite; display: grid; place-content: center; color: #01b4f9; box-shadow: 0 0 100px #01b4f9, 0 0 20px #01b4f9, 0 0 30px #01b4f9; font-family: impact; font-size: 35px; border: 15px outset #01b4f9; } @keyframes animate { 0% { transform: rotateX(0deg) rotateY(0deg) rotateZ(0deg); } 100% { transform: rotateX(360deg) rotateY(360deg) rotateZ(360deg); } }
JS
Copy
/* Replace with your JS Code (Leave empty if not needed) */
