Source Code:
(back to article)
Submit
Result:
Report an issue
<!DOCTYPE html> <html> <head> <title>Title of the document</title> <style> .button { background-color: #1c87c9; -webkit-border-radius: 60px; border-radius: 60px; border: none; color: #eeeeee; cursor: pointer; display: inline-block; font-family: sans-serif; font-size: 20px; padding: 5px 15px; text-align: center; text-decoration: none; } @keyframes glowing { 0% { background-color: #2ba805; box-shadow: 0 0 5px #2ba805; } 50% { background-color: #49e819; box-shadow: 0 0 20px #49e819; } 100% { background-color: #2ba805; box-shadow: 0 0 5px #2ba805; } } .button { animation: glowing 1300ms infinite; } </style> </head> <body> <h2>Create flashing/glowing button</h2> <a class="button" href="#">Click here!</a> <button type="submit" class="button">Click here!</button> </body> </html>