Image
Actions
Switch Theme
Getting startedInstallation
Basics
SocialsYouTube
Facebook
Getting started
Image
Jose Tamu
July 16, 2024 / Image Beginner / Image CSS only

Ripple Button

Ripple Top
Image
Ripple Bottom
Image
Ripple Left
Image
Ripple Right
Image

Animation controls

From: top, bottom, left or right. Just like the demos.
Amplitude: determines the size of the mask when hovered. Has to be set in %. It is specially useful for square or big buttons.
Skew: determines the amount of skew to apply to the title. Learn more about skew here.
In transition duration: determines the entrance duration of the mask.
Out transition duration: determines the leave duration of the mask.
CSS easing: you can set any custom CSS easing of your own. Learn more about CSS easings here.

– Tamu

On this page