Actions
Switch Theme
Getting startedInstallation
Basics
SocialsYouTube
Facebook
Getting started
Jose Tamu
June 3, 2025 /  Beginner /  CSS only

Arrow Button v6

Arrow Button v6

How it works

Arrow Button v6 consists of a label and one arrow. These parts of the button can be styled at pleasure.

Text Animation controls

Duration

Arrow Animation controls

Translate from: the distance where the arrow will come from.
Translate duration: the duration applied to the distance animation.
Animation duration: the duration applied to the arrow movement on one single loop.
CSS easing: applied to both the entrance and the loop. You can set any custom CSS easing of your own. Learn more about CSS easings here.

On this page