Bell icon for push notifications and subscribe button

Are you looking for a bell icon to represent push notifications or to create a subscribe button on your website?

There are many free and open source resources where you can get an high-quality bell icon, in different formats, without the need to draw it manually.

The icon can be useful for example to create a button to subscribe to push notifications:

  • you can use the icon alone (🔔)
  • you can create a button with text and icon (🔔 Subscribe)

There are many alternative formats that you can use to display a bell icon on your website, for example:

  • Unicode and emoji: these characters are supported by all major OS / browsers and you can use them directly as normal text, without the need to get the icons from an external library
  • PNG images: PNG is the image format traditionally used for icons
  • SVG images: vector graphics are lightweight and can scale easily to any size without loosing quality
  • CSS: some artists can create simple drawings and icons using only CSS
  • Fonts: some icon packs, like FontAwesome, are usually imported as fonts (e.g. woff2 or other font packaging formats)
  • Components: some libraries also offer the icons as Web Components, React components or Vue.js components for simplicity
  • Combined solutions (e.g. CSS + Font) or other solutions (e.g. Base64 PNG).

The following table is a list of high-quality icon packs that include a “bell” icon or a “notifications” icon.

If you are looking for a bell icon for a button or for any other UI component, you will certainly find an icon that you like in the following resources:

UnicodeN/ABell (🔔), Bell with slash (🔕)Unicode character, HTML entity
FontAwesomeMIT, CC BYbell, bells, bell-on, bell-plus, bell-slashSVG, Font, CSS + Font, Component
HeroiconsMITbellSVG, Component
Google Material IconsApache licenseNotifications, Notifications Active, Circle Notifications, Notifications Off, Notification Add, Add Alert, Edit Notifications, Notification Important, Notifications Paused, moreFont, SVG, PNG
Bootstrap IconsMITbell, bell-slashSVG, Font
IoniconsMITnotifications, notifications-circle, notifications-off, notifications-off-circleSVG, Component
Feather iconsMITbell, bell-offSVG
css.ggMITBellCSS, SVG, Component
FlaticonAttribution, CommercialHundreds of “bell” iconsSVG, PNG
Icons8Attribution, CommercialHundreds of “bell” iconsSVG, PNG, Base64
PixabayPixabay License, No AttributionSome illustrations of bellsPNG, SVG

Leave a Comment