---
title: "Quick Social Links — Free Framer component · Best of Framer"
description: "Free Framer component · by Raviteja Karrothu · Navigation. This is a Quick Social Links component with smooth hover interaction and label reveal."
canonical: "https://framer.elliotli.dev/component/quick-social-links"
---

[Home](/)/[Components](/components)/[Navigation](/components/category/navigation)/Quick Social Links

# Quick Social Links

Interactive socials links

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

![Quick Social Links preview image 1](https://framer.elliotli.dev/og/component/quick-social-links/12825ae1387cda28/1600x1200.jpg)

## Summary

This is a Quick Social Links component with smooth hover interaction and label reveal.

## Description

This is a Quick Social Links component with smooth hover interaction and label reveal. Each icon scales on hover while the label appears above, aligned with the active item.

### Features

-   Smooth hover animation
    
-   Label reveal aligned to each icon
    
-   Clean and minimal layout
    
-   Fully customizable icons and links
    
-   Supports custom SVG and Phosphor icons
    

### Customization

-   Add or remove icons
    
-   Update labels and links
    
-   Adjust size, spacing, and hover scale
    
-   Use custom SVG or icon names
    

### Usage

Use this component in headers, footers, or profile sections to display quick access links with a clean interactive experience.

### How To Add Icons

1.  Click on the Component
    
2.  Click Social Links Field
    
3.  Then Click on Add Button
    
4.  Now u can See a SVG Code Field
    

For the Icons go to [**Phosphoricons**](https://phosphoricons.com/) Website

1.  Search for any icon that u want
    
2.  Change icon type like stroke, color
    
3.  Click Copy SVG
    

Now Come to the Framer again

1.  Paste the code in SVG Field
    
2.  Enter URL and Label Also
    

### Notes

Designed to be simple, flexible, and easy to integrate into any layout.

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

-   All · #1575

## Details

- **Author**: Raviteja Karrothu
- **Published**: 2026-04-24
- **Updated**: 2026-08-13
- **Added**: 2026-04-16
- **Categories**: Navigation

## More like this

-   [Reveal Navigations](/component/reveal-navigations) — Design Supply · Free — A calmer way to open your menu
-   [Collapsible Sidebar](/component/collapsible-sidebar) — Marso Angelov · $10 — Responsive Side Navigation
-   [Dial Picker](/component/dial-picker) — Tanmay Kaper · $14 — A machined dial for your projects
-   [Expanding Side Menu](/component/expanding-side-menu) — Russet Supply · $5 — Animated Framer Navigation