WEBLEB
Home
Editor
Login
Pro
English
English
Français
Español
Português
Deutsch
Italiano
हिंदी
Neon Glowing Effect
2406
Sado0zii_Dev
Open In Editor
Publish Your Code
Recommended
28 October 2025
HTML Button Hover Effects Example
30 August 2024
3D Card Hover Effect
31 October 2025
CSS Glitch Text Effect
HTML
Copy
Neon Glowing Effect
CSS
Copy
body{ margin: 0; padding: 0; background-color: black; } ul{ position: absolute; top: 50%; left: 50%; transform: translate(-50% , -50%); margin: 0; padding: 0; display: flex; } ul li{ list-style: none; width: 40px; height: 40px; background: white; border-radius: 50%; animation: glow 1.6s ease-in-out infinite; } @keyframes glow{ 0%,40%,100% { transform: scale(0.2); } 20%{ transform:scale(1); } } ul li:nth-child(1){ animation-delay: -1.4s; background: yellow; box-shadow:0 0 50px yellow; } ul li:nth-child(2){ animation-delay: -1.2s; background: red; box-shadow:0 0 50px red; } ul li:nth-child(3){ animation-delay: -1s; background: green; box-shadow:0 0 50px green; } ul li:nth-child(4){ animation-delay: -0.8s; background: orangered; box-shadow:0 0 50px orangered; } ul li:nth-child(5){ animation-delay: -0.6s; background: blue; box-shadow:0 0 50px blue; } ul li:nth-child(6){ animation-delay: -0.4s; background:purple ; box-shadow:0 0 50px purple; } ul li:nth-child(7){ animation-delay: -0.2s; background: rgb(212, 6, 199); box-shadow:0 0 50px rgb(212, 6, 199); }
JS
Copy
/* Replace with your JS Code (Leave empty if not needed) */