Visual Code

Visual Code Code:

1.index.html:

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Visual Code</title> <link rel="stylesheet" type="text/css" href="style.css"> </head> <body> ¨K0K </body> </html>

2.style.css:

@import url('https://fonts.googleapis.com/css2?family=Baloo+Chettan+2:wght@400;800&family=Fascinate&family=Kdam+Thmor+Pro&family=Oleo+Script+Swash+Caps&family=Oswald:wght@200&family=Permanent+Marker&family=Roboto:wght@100;300;400;500;700;900&family=Rubik+Distressed&family=Sigmar+One&display=swap'); body { margin: 0; padding: 0; box-sizing: border-box; font-family: 'Roboto', sans-serif; display: flex; justify-content: center; align-items: center; min-height: 100vh; background: black; } h2 { display: flex; color: transparent; font-size: 10vh; } h2 span { animation: animate 3s linear infinite; animation-delay: calc(0.1s * var(--i)); } @keyframes animate { 0% { color: white; filter: blur(2px) hue-rotate(0deg); text-shadow: 0 0 10px #00b3ff, 0 0 20px #00b3ff, 0 0 40px #00b3ff, 0 0 80px #00b3ff, 0 0 120px #00b3ff, 0 0 200px #00b3ff, 0 0 300px #00b3ff, 0 0 400px #00b3ff; } 30%,70% { color: white; filter: blur(2px) hue-rotate(360deg); text-shadow: 0 0 10px #00b3ff, 0 0 20px #00b3ff, 0 0 40px #00b3ff, 0 0 80px #00b3ff, 0 0 120px #00b3ff, 0 0 200px #00b3ff; } 100% { color: transparent; box-shadow: none; filter: blur(2px) hue-rotate(0deg); } }

Оставьте комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *