devpack
EnglishEspañolPortuguêsBahasa IndonesiaFrançaisРусскийDeutschTiếng Việt

Kostenlose Glocken-Icons (SVG)

48 kostenlose Glocken-Icons aus Open-Source-Sets – klicke auf eins, um Größe, Farbe und Strichstärke anzupassen, und kopiere es als SVG, JSX, Data URI oder CSS.

Aktualisiert am

bell
Lucidebell
Tablerbell
Heroiconsbell
Phosphorbell
Bootstrap Iconsbell
Iconoirbell
Material Design Iconsbell-dot
Lucidebell-filled
Tablerbell-16-solid
Heroiconsbell-bold
Phosphorbell-fill
Bootstrap Iconsbell-off
Iconoirbell-outline
Material Design Iconsbell-off
Lucidebell-x
Tablerbell-20-solid
Heroiconsbell-duotone
Phosphorbell-slash
Bootstrap Iconsbell-cog
Material Design Iconsbell-plus
Lucidebell-x-filled
Tablerbell-solid
Heroiconsbell-fill
Phosphorbell-slash-fill
Bootstrap Iconsbell-cog-outline
Material Design Iconsbell-ring
Lucidebell-z
Tablerbell-alert
Heroiconsbell-light
Phosphorbell-off
Material Design Iconsbell-check
Lucidebell-z-filled
Tablerbell-alert-16-solid
Heroiconsbell-thin
Phosphorbell-off-outline
Material Design Iconsbell-minus
Lucidebell-up
Tablerbell-alert-20-solid
Heroiconsbell-z
Phosphorbell-plus
Material Design Iconsbell-cog
Tablerbell-alert-solid
Heroiconsbell-z-bold
Phosphorbell-plus-outline
Material Design Iconsbell-off
Tablerbell-slash
Heroiconsbell-z-duotone
Phosphor

Glocken-Icons verwenden

Eine Glocke öffnet Benachrichtigungen, oft mit einem Punkt oder Zähler für ungelesene Einträge.

Alle Icons hier folgen currentColor, nehmen also die Textfarbe des Elements an, in dem sie stehen – ein SVG funktioniert auf hellen und dunklen Hintergründen, in Links und in Buttons. Setze eine feste width und height (oder definiere die Größe per CSS mit 1em), damit sich das Layout beim Laden der Seite nicht verschiebt.

Barrierefreie Icons

Ist das Icon rein dekorativ oder steht neben sichtbarem Text, füge aria-hidden="true" hinzu. Ist es der einzige Inhalt eines Buttons oder Links, gib diesem Element ein aria-label wie „Glocke“.

Lizenzen

Diese Glocken-Icons stammen von Lucide, Tabler, Heroicons, Phosphor, Bootstrap Icons, Iconoir und Material Design Icons – Open-Source-Sets unter MIT-, ISC- oder Apache-2.0-Lizenz, die persönliche und kommerzielle Nutzung erlauben. Brauchst du etwas anderes? Durchsuche alle über 70.000 Icons im SVG Icon Finder.

Häufige Fragen

Sind diese Glocken-Icons kostenlos für kommerzielle Nutzung?
Ja. Sie stammen aus Open-Source-Icon-Sets unter MIT-, ISC- oder Apache-2.0-Lizenz, die kommerzielle Nutzung erlauben. Behalte den Lizenzhinweis bei, wenn du die Icon-Dateien selbst weitergibst.
Wie ändere ich die Farbe eines Glocken-Icons?
Die SVGs verwenden currentColor, also setze die CSS-Farbe des übergeordneten Elements – oder öffne das Icon im Finder und wähle vor dem Kopieren eine feste Farbe.
Kann ich diese Icons in Webflow oder React verwenden?
Ja. Öffne ein Icon und nutze „Copy to Webflow“ (fügt ein Code Embed ein) oder „Copy JSX“ für eine React-Komponente.