Buttons Bootstrap 5Free+ CSS+ JS
Add a button to your UI with Liquid Button animation with JS and CSS example. Free Bootstrap 5 code — HTML, CSS & JS ready to copy, MIT licensed.
4.7k views69 downloads
gosnippets.com/preview/liquid-button-animation-with-js-and-css-example
Source Code
1<svg class="liquid-button"></svg>
2<svg class="liquid-button"
3 data-width="50"
4 data-height="50"
5 data-text="✖"
6></svg>
7<svg class="liquid-button"
8 data-color1="#cb60b3"
9 data-color2="#c146a1"
10 data-color3="#db36a4"
11 data-text="colored"
12></svg>
13<svg class="liquid-button"
14 data-color1="#ccc"
15 data-color2="#000"
16 data-color3="#232425"
17 data-text="black & white"
18></svg>
19<svg class="liquid-button"
20 data-text="different viscosity"
21 data-force-factor="0.1"
22 data-layer-1-viscosity="0.5"
23 data-layer-2-viscosity="0.4"
24 data-layer-1-mouse-force="400"
25 data-layer-2-mouse-force="500"
26 data-layer-1-force-limit="1"
27 data-layer-2-force-limit="2"
28></svg>
29<svg class="liquid-button"
30 data-text="hover"
31 data-hover-factor="-10"
32></svg>More Buttons snippets
Pure CSS Neon Button
Add a button to your UI with Pure CSS Neon Button. Free Bootstrap 5 code — HTML & CSS ready to copy, MIT licensed.
ButtonsView →
Firework Animation on Button Click
Firework Animation on Button Click — a free Bootstrap 5 button snippet. Copy the HTML, CSS & JS and paste straight into your Bootstrap 5 project.
ButtonsView →
Pure CSS Pulsing Button ripple effect animation
Pure CSS Pulsing Button ripple effect animation: a hand-crafted, open-source Bootstrap 5 button. HTML & CSS included, ready to copy.
ButtonsView →
Comments(0)
No comments yet — be the first to start the discussion.
Sign in to join the conversation.