← All elements
<label class="pc-like">
<input type="checkbox">
<span class="pc-like__icon">
<svg viewBox="0 0 24 24" aria-hidden="true">
<path d="M12 21.35l-1.45-1.32C5.4 15.36 2 12.28 2 8.5 2 5.42 4.42 3 7.5 3c1.74 0 3.41.81 4.5 2.09C13.09 3.81 14.76 3 16.5 3 19.58 3 22 5.42 22 8.5c0 3.78-3.4 6.86-8.55 11.54L12 21.35z"/>
</svg>
</span>
Save for later
</label>About this button
A pill-shaped save button where a hidden checkbox fills the heart, pops it, and fires a ring and four-colour dots on the first click. Open an example, copy the HTML and the CSS, and paste them into your page. There is nothing to install and no JavaScript to load.