Post thumbnail: 7 CSS Play/Pause Buttons

7 CSS Play/Pause Buttons

Collection of hand-picked free HTML and CSS play/pause button code examples.

Related Articles

  1. CSS Buttons
  2. CSS Button Hover Effects
  3. CSS 3D Buttons
  4. CSS Submit Buttons
  5. CSS Gradient Buttons
  6. CSS Flat Buttons
  7. CSS Close Buttons
  8. CSS Download Buttons

Demo image: Play Button Animation Play Button Animation - GIF Demo

Author

  • Eric Brewer

Made with

  • HTML (Pug) / CSS (SCSS) / JavaScript (Babel)

About the code

Play Button Animation

Play button animation in HTML, CSS and JS.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Dependencies: font-awesome.css

Demo image: CSS Play Button CSS Play Button - GIF Demo

Author

  • Arnold Longequeue

Made with

  • HTML / CSS (SCSS)

About the code

CSS Play Button

Play button with SVG and CSS animation.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Dependencies: -

Demo image: Play Button Play Button - GIF Demo

Author

  • Baron

Made with

  • HTML / CSS

About the code

Play Button

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Dependencies: -

Demo image: Bouncing Play Button Bouncing Play Button - GIF Demo

Author

  • mi-ca

Made with

  • HTML / CSS / JavaScript

About the code

Bouncing Play Button

Bouncing play button made with http://bouncejs.com/.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Dependencies: -

Demo image: SVG Play Button SVG Play Button - GIF Demo

Author

  • Ivan Villa

Made with

  • HTML / CSS (SCSS)

About the code

SVG Play Button

Simple play button SVG animation.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Dependencies: -

Demo image: Play Button Play Button - GIF Demo

Author

  • Luke Meyrick

Made with

  • HTML / CSS (SCSS)

About the code

Play Button

Play button with SVG and CSS.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Dependencies: -

Demo image: Attractive Play Button Attractive Play Button - GIF Demo

Author

  • J Scott Smith

Made with

  • HTML / CSS (SCSS)

About the code

Attractive Play Button

Play button with spinning reel on hover.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Dependencies: -

back to top