Neon Glow Image - MeggiTools
Run
Toggle Theme
Share Link
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Neon Glow Image</title> <style> body { display: flex; justify-content: center; align-items: center; height: 100vh; background: #121212; margin: 0; font-family: Arial, sans-serif; } .image-container { position: relative; width: 300px; height: 400px; overflow: hidden; border-radius: 20px; } .image { width: 100%; height: 100%; object-fit: cover; border-radius: 20px; filter: brightness(80%) contrast(120%); transition: filter 0.5s ease-in-out; } .image-container:hover .image { filter: brightness(100%) contrast(100%); box-shadow: 0 0 20px 10px #ff00ff; } </style> </head> <body> <div class="image-container"> <img class="image" src="https://via.placeholder.com/300x400" alt="Sample Image"> </div> </body> </html>