Fizzy CSS Button with super fizzy particle action

Buttons Bootstrap 5Free+ CSS

Add a button to your UI with Fizzy CSS Button with super fizzy particle action. Free Bootstrap 5 code — HTML & CSS ready to copy, MIT licensed.

3.0k views59 downloads5 years ago

gosnippets.com/preview/fizzy-css-button-with-super-fizzy-particle-action

Source Code

1<div class='button'>
2  <h1>Fizzy CSS Button</h1> 
3  <input id='button' type='checkbox'>
4  <label for='button'>
5    <div class='button_inner q'>
6      <i class='l ion-log-in'></i>
7      <span class='t'>Downloads</span>
8      <span>
9        <i class='tick ion-checkmark-round'></i>
10      </span>
11      <div class='b_l_quad'>
12        <div class='button_spots'></div>
13        <div class='button_spots'></div>
14        <div class='button_spots'></div>
15        <div class='button_spots'></div>
16        <div class='button_spots'></div>
17        <div class='button_spots'></div>
18        <div class='button_spots'></div>
19        <div class='button_spots'></div>
20        <div class='button_spots'></div>
21        <div class='button_spots'></div>
22        <div class='button_spots'></div>
23        <div class='button_spots'></div>
24        <div class='button_spots'></div>
25        <div class='button_spots'></div>
26        <div class='button_spots'></div>
27        <div class='button_spots'></div>
28        <div class='button_spots'></div>
29        <div class='button_spots'></div>
30        <div class='button_spots'></div>
31        <div class='button_spots'></div>
32        <div class='button_spots'></div>
33        <div class='button_spots'></div>
34        <div class='button_spots'></div>
35        <div class='button_spots'></div>
36        <div class='button_spots'></div>
37        <div class='button_spots'></div>
38        <div class='button_spots'></div>
39        <div class='button_spots'></div>
40        <div class='button_spots'></div>
41        <div class='button_spots'></div>
42        <div class='button_spots'></div>
43        <div class='button_spots'></div>
44        <div class='button_spots'></div>
45        <div class='button_spots'></div>
46        <div class='button_spots'></div>
47        <div class='button_spots'></div>
48        <div class='button_spots'></div>
49        <div class='button_spots'></div>
50        <div class='button_spots'></div>
51        <div class='button_spots'></div>
52        <div class='button_spots'></div>
53        <div class='button_spots'></div>
54        <div class='button_spots'></div>
55        <div class='button_spots'></div>
56        <div class='button_spots'></div>
57        <div class='button_spots'></div>
58        <div class='button_spots'></div>
59        <div class='button_spots'></div>
60        <div class='button_spots'></div>
61        <div class='button_spots'></div>
62        <div class='button_spots'></div>
63        <div class='button_spots'></div>
64      </div>
65    </div>
66  </label>
67</div>

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.

1<div class='button'> 2 <h1>Fizzy CSS Button</h1> 3 <input id='button' type='checkbox'> 4 <label for='button'> 5 <div class='button_inner q'> 6 <i class='l ion-log-in'></i> 7 <span class='t'>Downloads</span> 8 <span> 9 <i class='tick ion-checkmark-round'></i> 10 </span> 11 <div class='b_l_quad'> 12 <div class='button_spots'></div> 13 <div class='button_spots'></div> 14 <div class='button_spots'></div> 15 <div class='button_spots'></div> 16 <div class='button_spots'></div> 17 <div class='button_spots'></div> 18 <div class='button_spots'></div> 19 <div class='button_spots'></div> 20 <div class='button_spots'></div> 21 <div class='button_spots'></div> 22 <div class='button_spots'></div> 23 <div class='button_spots'></div> 24 <div class='button_spots'></div> 25 <div class='button_spots'></div> 26 <div class='button_spots'></div> 27 <div class='button_spots'></div> 28 <div class='button_spots'></div> 29 <div class='button_spots'></div> 30 <div class='button_spots'></div> 31 <div class='button_spots'></div> 32 <div class='button_spots'></div> 33 <div class='button_spots'></div> 34 <div class='button_spots'></div> 35 <div class='button_spots'></div> 36 <div class='button_spots'></div> 37 <div class='button_spots'></div> 38 <div class='button_spots'></div> 39 <div class='button_spots'></div> 40 <div class='button_spots'></div> 41 <div class='button_spots'></div> 42 <div class='button_spots'></div> 43 <div class='button_spots'></div> 44 <div class='button_spots'></div> 45 <div class='button_spots'></div> 46 <div class='button_spots'></div> 47 <div class='button_spots'></div> 48 <div class='button_spots'></div> 49 <div class='button_spots'></div> 50 <div class='button_spots'></div> 51 <div class='button_spots'></div> 52 <div class='button_spots'></div> 53 <div class='button_spots'></div> 54 <div class='button_spots'></div> 55 <div class='button_spots'></div> 56 <div class='button_spots'></div> 57 <div class='button_spots'></div> 58 <div class='button_spots'></div> 59 <div class='button_spots'></div> 60 <div class='button_spots'></div> 61 <div class='button_spots'></div> 62 <div class='button_spots'></div> 63 <div class='button_spots'></div> 64 </div> 65 </div> 66 </label> 67</div>