Tutorials

Figma Tutorial: Hintergrund kostenlos entfernen (Full Guide)

Melden

Hier ist ein umfassendes Tutorial, wie du in Figma kostenlos Hintergründe entfernen kannst. Da Figma nativ (noch) kein integriertes Ein-Klick-Tool für die kostenlose Hintergrundentfernung hat, nutzen wir die besten Plugins und Workarounds.

Das Entfernen von Hintergründen ist eine der häufigsten Aufgaben im UI/UX-Design. In diesem Guide zeige ich dir drei Wege, wie du das direkt in Figma oder mit kostenlosen Tools erledigst, ohne für teure Abos zu bezahlen.

Methode 1: Der beste Weg über Plugins (Direkt in Figma)

Plugins sind die schnellste Lösung, um den Workflow nicht zu unterbrechen. Während der Marktführer "Remove BG" oft Credits verlangt, gibt es gute kostenlose Alternativen.

Empfohlenes Plugin: Icons8 Background Remover

  1. Plugin suchen: Klicke in deinem Figma-File oben auf das Ressourcen-Icon (die Raute mit dem Punkt) oder drücke Shift + I.
  2. Suche unter dem Tab „Plugins“ nach "Icons8 Background Remover".
  3. Bild auswählen: Klicke das Foto an, dessen Hintergrund du entfernen möchtest.
  4. Plugin ausführen: Klicke im Plugin-Fenster auf "Remove Background".
  5. Ergebnis: Der Hintergrund wird automatisch entfernt und das Bild bleibt in Figma.

Hinweis: Icons8 ist aktuell einer der großzügigsten Anbieter für kostenlose Entfernungen direkt in der App.

Methode 2: Maximale Qualität mit Adobe Express (Externer Workaround)

Wenn die Plugin-Qualität nicht ausreicht oder das Bild sehr komplex ist (z. B. Haare), ist dieser Weg der beste, da er komplett kostenlos und hochauflösend ist.

  1. Webseite öffnen: Gehe auf Adobe Express Background Remover.
  2. Bild hochladen: Ziehe dein Bild per Drag & Drop hinein.
  3. Download: Nachdem die KI den Hintergrund entfernt hat, lade das Bild als PNG herunter. (Ein kostenloser Adobe-Account ist eventuell erforderlich, aber die Funktion ist gratis).
  4. Zurück zu Figma: Ziehe die heruntergeladene PNG-Datei einfach direkt in dein Figma-Projekt.

Vorteil: Die KI von Adobe ist oft präziser als Standard-Plugins und bietet eine höhere Auflösung für den Export.

Methode 3: Die manuelle Methode mit Masken (Keine Tools nötig)

Wenn du die volle Kontrolle brauchst oder nur einen Teil eines Bildes freistellen willst, nutzt du das Pen-Tool.

  1. Pen-Tool wählen: Drücke P auf deiner Tastatur.
  2. Pfad zeichnen: Umfahre das Objekt, das du behalten möchtest, mit dem Zeichenstift-Werkzeug. Klicke und ziehe, um Kurven zu erstellen.
  3. Pfad schließen: Stelle sicher, dass der Pfad am Ende geschlossen ist (klicke auf den ersten Punkt).
  4. Fläche füllen: Klicke in der rechten Seitenleiste bei „Fill“ auf das Plus-Icon, damit die Form eine Farbe bekommt.
  5. Maske erstellen:
    • Lege deine gezeichnete Form unter das Bild im Ebenen-Menü (Links).
    • Wähle beide Elemente aus (Bild + Form).
    • Klicke oben in der Mitte auf das Masken-Symbol (der Kreis im Quadrat) oder drücke Strg + Alt + M (Windows) bzw. Cmd + Option + M (Mac).
  6. Feinschliff: Du kannst die Punkte des Pfades jederzeit nachträglich verschieben, um die Auswahl zu perfektionieren.

Profi-Tipp: Welches Tool für welchen Zweck?

  • Schnelle Entwürfe: Nutze das Icons8 Plugin. Es spart Zeit und bleibt innerhalb von Figma.
  • Finales Design / High-Res: Nutze den Adobe Express Weg. Die Kanten werden sauberer und professioneller.
  • Geometrische Objekte: Nutze die Masken-Methode. So bleibst du non-destruktiv und kannst die Form jederzeit anpassen.

Zusammenfassung

Hintergrundentfernung in Figma muss nichts kosten. Mit dem richtigen Plugin oder dem kurzen Umweg über einen kostenlosen Web-Service erzielst du professionelle Ergebnisse für deine Prototypen und Designs.

Viel Erfolg beim Gestalten!

0