---
title: "Notification Bell — Free Framer component · Best of Framer"
description: "Free Framer component · by John Valentine · Interactive. Add a professional notification center to your site with a sleek bell + dropdown system."
canonical: "https://framer.elliotli.dev/component/notification-bell"
---

[Home](/)/[Components](/components)/[Interactive](/components/category/interactive)/Notification Bell

# Notification Bell

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

![Notification Bell preview image 1](https://framer.elliotli.dev/og/component/notification-bell/c89801e1064cc457/1600x1200.jpg)

## Summary

Add a professional notification center to your site with a sleek bell + dropdown system.

## Description

Add a professional notification center to your site with a sleek bell + dropdown system. The badge count highlights new updates, while the dropdown feed shows recent notifications in a scrollable, polished list.

**Features**

-   **Bell icon with badge:** highlights unread notifications
    
-   **Dropdown feed:** clickable items with icon + text + link
    
-   **Auto-mark as read:** notifications update on open
    
-   **Scrollable list:** handles longer feeds smoothly
    
-   **Custom controls:** notification array, badge color, dropdown width, radius, shadow
    
-   **Clean design:** soft dividers, subtle hover highlights, smooth slide/fade animation
    

Perfect for SaaS apps, dashboards, or websites that need an elegant, real-time update feed.

Tags: notification, bell, feed, alerts, updates, dropdown, badge, ui, messages, app

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

-   All · #7224

## Details

- **Author**: John Valentine
- **Published**: 2025-10-08
- **Updated**: 2025-10-08
- **Added**: 2025-09-29
- **Categories**: Interactive

## More like this

-   [Velvet Curtain](/component/velvet-curtain) — Sarthak Prakash · $12 — Cinematic curtain reveal effect
-   [Image-Compare Slider](/component/image-compare-slider) — Studio Digital · Free — Reveal what changed, beautifully
-   [Lesson Packages](/component/lesson-packages) — Shelfless Studio · $9 — Lesson bundles with savings shown
-   [Deskbell AI Chatbot](/component/deskbell-ai-chatbot) — NS. Studio · Free — AI site chat, works with Chatbase