WEBLEB
Home
Editor
Accedi
Pro
Italiano
English
Français
Español
Português
Deutsch
Italiano
हिंदी
Caricatore luminoso
1403
ledoc
Apri nell'Editor
Pubblica il Tuo Codice
Consigliato
21 September 2024
Menu mobile
27 November 2024
Pagina di destinazione - Modello IA
30 August 2024
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) */
