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

Kostenlose Pfeil-Icons (SVG)

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

Aktualisiert am

arrow-up
Lucidearrow-up
Tablerarrow-up
Heroiconsarrow-up
Phosphorarrow-up
Bootstrap Iconsarrow-up
Iconoirarrow-up-12-filled
Fluent UIline-end-arrow
Material Symbolsarrow
Material Design Iconsarrow-up
Carbonbow-arrow
Lucidearrow-back
Tablerarrow-up-16-solid
Heroiconsarrow-up-bold
Phosphorarrow-down
Bootstrap Iconsarrow-down
Iconoirarrow-up-12-regular
Fluent UIarrow-back
Material Symbolsarrow-up
Material Design Iconsarrow-down
Carbona-arrow-up
Lucidearrow-down
Tablerarrow-up-20-solid
Heroiconsarrow-up-duotone
Phosphorarrow-left
Bootstrap Iconsarrow-left
Iconoirarrow-up-16-filled
Fluent UIarrow-back-rounded
Material Symbolsarrow-up-bold
Material Design Iconsarrow-left
Carbonarrow-down
Lucidearrow-fork
Tablerarrow-up-solid
Heroiconsarrow-up-fill
Phosphormaps-arrow
Iconoirarrow-up-16-regular
Fluent UIarrow-left
Material Symbolsarrow-up-thin
Material Design Iconsarrow-left
Lucidearrow-left
Tablerarrow-up-light
Phosphorpath-arrow
Iconoirarrow-up-20-filled
Fluent UIarrow-left-rounded
Material Symbolsarrow-all
Material Design Iconsarrow-up-thin
Phosphorpath-arrow-solid
Iconoirarrow-up-20-regular
Fluent UI

Pfeil-Icons verwenden

Pfeile zeigen eine Richtung an — vor und zurück, aufklappen und zuklappen, Sortierreihenfolge oder ein Link, der die Seite verlässt.

Alle Icons hier folgen currentColor, übernehmen also die Textfarbe des Elements, in dem sie stehen — ein SVG funktioniert auf hellen und dunklen Hintergründen, in Links und in Buttons. Setze eine explizite 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 dekorativ oder steht es 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 „Pfeil“.

Lizenzen

Diese Pfeil-Icons stammen von Lucide, Tabler, Heroicons, Phosphor, Bootstrap Icons, Iconoir, Fluent UI, Material Symbols, Material Design Icons und Carbon — Open-Source-Sets unter MIT-, ISC- oder Apache-2.0-Lizenz, die private und kommerzielle Nutzung erlauben. Brauchst du etwas anderes? Durchsuche alle 70.000+ Icons im SVG Icon Finder.

Häufige Fragen

Sind diese Pfeil-Icons kostenlos für die 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 Pfeil-Icons?
Die SVGs verwenden currentColor, also setze die CSS-color 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.