Single Element & CSS Only UI Interactions

Author: raphaelfabeni
Views Total: 544 views
Official Page: Go to website
Last Update: August 5, 2019
License: MIT


Single Element & CSS Only UI Interactions


A set of graceful UI interactions built using single element and CSS/CSS3.

UI Interactions Included:

  • Arrows: smooth transitions between top and bottom arrows.
  • Hamburger button: smooth transitions between hamburger and close buttons.
  • Plus: smooth transitions between Plus and Minus icons.
  • Loading button: inline loading indicator in the button.
  • Toggle button: fancy animations on toggle buttons.

See It In Action:

How to use it:

1. Go to the official website:

2. Copy and paste the HTML & CSS snippets into your document. Done.


UI Interactions Arrows


UI Interactions Hamburger Menu

Hamburger Menu

UI Interactions Plus


UI Interactions Loading Indicator

Loading Indicator

UI Interactions Toggle Button

oggle Button

See also  Linear Step-by-Step Flow - Bootstrap Steps

Leave a Reply

Your email address will not be published. Required fields are marked *