Play icon using pure css
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>Play icon using pure css</title> <style> body { background-color: #fff; margin: 0; padding: 0; } .block { position: relative; width: 200px; height: 200px; } .play-button { width: 100px; height: 100px; position: absolute; top: 48px; right: 48px; border: 4px solid #222; border-radius: 54px; } .play-button span { position: absolute; top: 14px; left: 30px; width: 0; height: 0; border-top: 36px solid transparent; border-bottom: 36px solid transparent; border-left: 60px solid #222; } </style> </head> <body> <div class="block"> <span class="play-button"> <span></span> </span> </div> </body> </html>
Links:
Licensed under CC BY-SA 3.0