---
title: "Instagram Button — Free Framer component · Best of Framer"
description: "Free Framer component · by Curtis · Buttons. This Instagram button component combines a clean social link with an interactive preview feature."
canonical: "https://framer.elliotli.dev/component/instagram-button"
---

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

# Instagram Button

Instagram button with hover post preview

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

![Instagram Button preview image 1](https://framer.elliotli.dev/og/component/instagram-button/a079674b150a906e/1600x1200.jpg)

## Summary

This Instagram button component combines a clean social link with an interactive preview feature.

## Description

**Customizable Options :**

-   **Text** : Set the font style for responsive font size.
    
-   **Link** : Add a destination URL for the button.
    
-   Post Images: Upload three post images.
    
-   **Background Colour** : Define the default button background color.
    
-   **Text Color** : Set the text color in the normal state.
    
-   **Fill Text Color** : Set the text color when the button is filled.
    

This Instagram button component combines a clean social link with an interactive preview feature. When users hover over the button, it displays a grid of mini cards styled like Instagram posts, each showing images you can customize.

Perfect for portfolios, landing pages, or any site where you want to give visitors a quick glimpse of your Instagram content without them leaving your page. The hover interaction creates an engaging experience that encourages clicks while providing immediate visual context.

Customize the button color to match your brand and upload your own images for each preview card. The component maintains Instagram's familiar aesthetic while giving you full control over the presentation. Works seamlessly in any Framer project and requires no coding. Just drop it in, configure your settings, add images and enter your Instagram profile URL.

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

-   All · #2168

## Details

- **Author**: Curtis
- **Published**: 2026-02-12
- **Updated**: 2026-02-10
- **Added**: 2026-01-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
