---
title: "CopyButton — Free Framer component · Best of Framer"
description: "Free Framer component · by Clément Rog · Buttons. A production-ready copy button with satisfying feedback."
canonical: "https://framer.elliotli.dev/component/copybutton"
---

[Home](/)/[Components](/components)/[Buttons](/components/category/buttons)/CopyButton

# CopyButton

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

![CopyButton preview image 1](https://framer.elliotli.dev/og/component/copybutton/8d0a0e551462a3b8/1600x1200.jpg)

## Summary

A production-ready copy button with satisfying feedback.

## Description

A production-ready copy button with satisfying feedback. Click triggers a smooth scale animation, icon morphs from clipboard to checkmark, background shifts to a success color, then auto-resets. Handles clipboard errors gracefully with a dedicated error state.

**Customizable properties:**

-   **Text to Copy** : The content copied to clipboard (supports multiline)
    
-   **Idle / Copied / Error Labels** : Button text for each state
    
-   **Show Icon** : Toggle the animated clipboard/checkmark icons
    
-   **Size** : Small, Medium, or Large presets
    
-   **Style** : Filled (solid background), Outline (border only), or Ghost (transparent)
    
-   **Idle Color / Idle Text** : Background and text colors in default state
    
-   **Copied Color / Copied Text** : Background and text colors after successful copy
    
-   **Error Color** : Background color when clipboard access fails
    
-   **Radius** : Corner rounding (0–24px)
    
-   **Reset Delay** —:How long success/error states show before reverting (500–5000ms)
    
-   **Haptics** : Vibrate on mobile devices when copied
    

Works on any background. Clipboard API fallback for older browsers.

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

-   All · #6612

## Details

- **Author**: Clément Rog
- **Published**: 2026-01-07
- **Updated**: 2026-01-06
- **Added**: 2025-12-17
- **Categories**: Buttons

## More like this

-   [Liquid Blob Button](/component/liquid-blob-button) — Oddframe · Free — Interactive Liquid Blob CTA Button
-   [Pixel Face Toggle](/component/pixel-face-toggle) — Zac Nielson · $9 — Dark mode switch with a pixel face
-   [Liquid Hover Media](/component/liquid-hover-media) — Bardia Madani · $5 — Fluid media distortion on hover
-   [Eye Glow Button](/component/eye-glow-button) — Frame Native · Free — Cursor-following eyes, soft glow