---
title: "Particle Button — Free Framer component · Best of Framer"
description: "Free Framer component · by Matt · Buttons. About Particle Button is an animated CTA that dissolves into hundreds of particles on click or hover."
canonical: "https://framer.elliotli.dev/component/particle-button"
---

[Home](/)/[Components](/components)/[Buttons](/components/category/buttons)/Particle Button

# Particle Button

Turn every click into a moment

[View on Framer](https://framer.com/marketplace/components/particle-button/?via=elliot-li)

![Particle Button preview image 1](https://framer.elliotli.dev/og/component/particle-button/b5938ecac389387c/1600x1200.jpg)

## Summary

About Particle Button is an animated CTA that dissolves into hundreds of particles on click or hover.

## Description

Based on [Particle Effects for Buttons by Luis Manuel / Codrops](https://tympanus.net/codrops/2018/04/25/particle-effects-for-buttons/), rebuilt and expanded for Framer.

## About

Particle Button is an animated CTA that dissolves into hundreds of particles on click or hover. Choose from 12 ready-made effects or create your own custom particle animation, set the sweep direction, and let the button rebuild automatically or remain dissolved as a one-shot interaction. It stays responsive, accessible, and usable throughout the animation.

## What you can customize

Customize the label, link, trigger, return behavior, direction, particle preset, shape, fill style, colors, amount, size, speed, duration, easing, typography, padding, radius, background, and border. The self-contained Framer code component requires no external dependencies and includes keyboard and reduced-motion support.

## Great for (examples)

Just a few ideas, use it anywhere you want a more memorable animated button or CTA interaction:

-   Animated CTA buttons and interactive buttons
    
-   SaaS websites and product landing pages
    
-   Startup launches and waitlist pages
    
-   Hero sections and conversion-focused CTAs
    
-   Creative portfolios and personal websites
    
-   Agency and design studio websites
    
-   Product launches and promotional pages
    
-   Event, gaming, and entertainment websites
    
-   Particle animations and dissolve effects
    
-   Hover effects, click animations, and microinteractions
    
-   Experimental interfaces and interactive brands
    
-   Responsive Framer templates
    

## Share your build

If you ship something cool with it, post it on X and tag me [@Matthias\_Oel](https://x.com/Matthias_Oel), or send it over. I’d love to see what you create.

## Need help?

Questions or feedback? Reach me anytime: [matthias@lmvision.de](mailto:matthias@lmvision.de) or on X [@Matthias\_Oel.](https://x.com/Matthias_Oel)

## Need a matching component?

Explore more interactive components for your next project:

-   [Camo Liquid Button ✨](https://framer.link/7J8Mdjb)
    
-   [Newsletter Button ✨](https://framer.link/Hl8FFfu)
    
-   [Explore all components](https://framer.link/fsd2pgh) 💪
    

## Rank history [How rankings work →](/terms#rankings)

-   All · #601

## Details

- **Author**: Matt
- **Published**: 2026-08-31
- **Updated**: 2026-10-30
- **Added**: 2026-08-31
- **Categories**: Buttons

## More like this

-   [Eye Glow Button](/component/eye-glow-button) — Frame Native · Free — Cursor-following eyes, soft glow
-   [Dash Stretch Button](/component/dash-stretch-button) — Pentaclay · Free — Animated Hover Button With a Dash
-   [Nova Theme Toggle](/component/nova-theme-toggle) — Shouvik Biswas · $12 — Three-Mode Theme Toggle
-   [Nabby: Copy Button](/component/nabby-copy-button) — Francesco Gallo · Free — Plug in your button, copy anything