---
title: "Hover Focus Button — Free Framer component · Best of Framer"
description: "Free Framer component · by The Ghavas · Buttons. About the component The component is fully customizable through the following properties found on the right panel: Customizable button text…"
canonical: "https://framer.elliotli.dev/component/hover-focus-button"
---

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

# Hover Focus Button

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

![Hover Focus Button preview image 1](https://framer.elliotli.dev/og/component/hover-focus-button/01d8f68bf94cd48e/1600x1200.jpg)

## Summary

About the component The component is fully customizable through the following properties found on the right panel: Customizable button text via the "Text" property Ability to set…

## Description

## About the component

The component is fully customizable through the following properties found on the right panel:

-   Customizable button text via the "Text" property
    
-   Ability to set a link destination
    
-   Adjustable background colors for default and hover states
    
-   Customizable text colors for default and hover states
    
-   Blur intensity control (how blurred the text starts)
    
-   Transition duration settings for focus and color effects
    
-   Optional scale effect toggle and amount
    
-   Padding, border radius, and font styling options
    

**Usage** To use the component, simply add it to your Framer project and customize the properties as needed. The blur-to-focus animation will automatically trigger on hover. This provides an easy way to add an engaging, interactive button element to Framer websites that creates curiosity and encourages clicks without any coding required.

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

-   All · #5772

## Details

- **Author**: The Ghavas
- **Published**: 2025-10-28
- **Updated**: 2025-12-05
- **Added**: 2025-10-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