WEBLEB
Home
Editor
Accedi
Pro
Italiano
English
Français
Español
Português
Deutsch
Italiano
हिंदी
Battito del cuore
1953
Lua_da_noite
Apri nell'Editor
Pubblica il Tuo Codice
Consigliato
15 October 2025
Livelli di animazione CSS: codifica, debug, frammenti
31 August 2024
3 September 2024
HTML
Copy
<!DOCTYPE html> <html lang="pt-br"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Batimento</title> <link rel="stylesheet" href="index.css"> </head> <body> <div class="heart"></div> </body> </html>
CSS
Copy
body{ margin: 0; padding: 0; min-height: 100vh; display: flex; align-items: center; justify-content: center; background: #0b1522; } .heart { height: 70px; width: 70px; background: #f20044; position: relative; transform: rotate(-45deg); box-shadow: -10px 0px 90px #f20044; animation: heart 0.6s linear infinite; } @keyframes heart { 0%{ transform: rotate(-45deg)scale(1.08); } 80%{ transform: rotate(-45deg)scale(1.0); } 100%{ transform: rotate(-45deg)scale(0.6s); }} .heart:before{ content: ''; position: absolute; height: 70px; width: 70px; background: #f20044; top: -50%; border-radius: 50px; box-shadow: -10px 0px 90px #f20044; } .heart:after{ content: ''; position: absolute; height: 70px; width: 70px; background: #f20044; right: -50%; border-radius: 50px; box-shadow: 10px 10px 90px #f20044; }
JS
Copy
/* Replace with your JS Code (Leave empty if not needed) */
