Tiny Online Tools
Zeiger- & Diagramm-Pfeile ohne Illustrator
Pfeile leisten in UI und Dokumentation viel: Sie erklären Abläufe, heben Annotationen hervor, verbinden Ideen auf Folien und lenken den Blick auf Produktscreenshots. Dieser Generator liefert ein sauberes SVG-<path>, das du überall einfügen und per CSS stylen kannst.
Pfeilstile
- Gerade — schlichte Linie vom Anfang bis zur Spitze. Ideal für schnelle Annotationen und kompakte Diagramme.
- Geschwungen — quadratisches Bezier mit einstellbarer Krümmung. Praktisch, wenn der Pfeil um andere Elemente herumführen soll.
- Zickzack — sägezahnartiger Verlauf, gut für einen „schnellen" oder „energetischen" Eindruck.
Spitzenarten
- Dreieck — gefülltes Polygon, die klassische „solide" Pfeilspitze.
- Offen — zwei Linienstriche, wirkt handgezeichnet.
- Doppelt — zwei gestapelte offene Spitzen, signalisieren Vorspulen oder Betonung.
Extras
- Strichstärke und Farbe gelten für den gesamten Pfeil.
- Kopfgröße ist unabhängig von der Strichstärke.
- Schwanzpunkt setzt einen Startmarker — schön für Vorher/Nachher-Zeiger.
Einsatzzwecke
- UI-Callouts und Onboarding-Touren
- Diagramme und Flowcharts
- Zeiger in Präsentationen
- Skizzenhafte Annotationen auf Marketing-Grafiken
- SVG-Icons für Links, CTAs oder „Weiterlesen"-Buttons
Da die Ausgabe pures SVG ist, kannst du sie per CSS (fill / stroke) umfärben, mit stroke-dasharray animieren oder in jedes Designwerkzeug importieren.