Formen machen den Großteil der Ebenen eines Designs aus.

Du kannst über das Menü „Shape Tools“ (Formwerkzeuge) in der Symbolleiste auf alle grundlegenden Formen zugreifen. Klicke auf den Abwärtspfeil neben dem Rechteck, um die Optionen anzuzeigen.

Es stehen sechs Formwerkzeuge zur Auswahl:

1. Rectangle (Rechteck)
2. Line (Linie)
3. Arrow (Pfeil)
4. Ellipse
5. Polygon
6. Star (Stern)
7. Häufig gestellte Fragen

Für Designs, die einzigartige oder komplexe Formen erfordern, kannst du mit dem einzigartigen Stiftwerkzeug von Figma dein eigenes Vektornetzwerk erstellen.

Tipps zum Erstellen von Formen

• Halte beim Ziehen die Umschalttaste gedrückt, um ordentliche Quadrate, Kreise und Polygone zu erstellen.
• Halte die Taste Option gedrückt, um die Form von ihrer Mitte aus zu erstellen und ihre Größe zu ändern.
• Halte die Umschalttaste und Option gedrückt, um beides zu tun.

Rechteckwerkzeug

Du kannst mit dem Rechteckwerkzeug Rechtecke und Quadrate erstellen.

1. Wähle in den Formwerkzeugen Rectangle (Rechteck) aus oder drücke die Taste R
2. Klicke auf eine Stelle in der Arbeitsfläche und ziehe den Cursor, um das Rechteck zu erstellen:

   

3. Die Abmessungen des Rechtecks werden am unteren Rand blau angezeigt:
4. In jeder Ecke der Form befindet sich ein Ziehpunkt, mit dem du die Größe der Form anpassen kannst.

Linienwerkzeug

Mit dem Linienwerkzeug kannst du Linien in jede Richtung erzeugen. Linien sind eine effektive Möglichkeit, um Inhalte innerhalb eines Designs aufzuteilen oder CSS-Ränder zu simulieren.

1. Wähle in den Formwerkzeugen Line (Linie) aus oder drücke die Taste L:

   

2. Klicke auf eine Stelle in der Arbeitsfläche und ziehe den Cursor, um die Linie zu erstellen:

   

3. Nachdem eine Linie erstellt hast, kannst du im Eigenschaften-Bedienfeld im Abschnitt Stroke (Strich) das Aussehen der Linie ändern:

   

   1. Passe in der Farbauswahl die Optionen Color (Farbe) und Opacity (Deckkraft) an.
   2. Mit der Option Weight (Stärke) kannst du die Dicke der Linie ändern. Mit Align (Ausrichten) legst du die Ausrichtung der Strichstärke fest. Zur Auswahl stehen Inner (Innen), Outer (Außen) oder Center (Mitte).
   3. Mit den Optionen Advanced Stroke (Erweiterter Strich) kannst du die Linie weiter anpassen. Definiere beispielsweise mit der Option Cap (Abschluss) das Aussehen des Linienendes und mit Join (Verbinden), wie sich die Linie verhält, wenn sie mit anderen Linien verbunden wird. Mit Dashes (Striche) erzeugst du gestrichelte Linien.

Pfeilwerkzeug

Mit dem Pfeilwerkzeug kannst du sowohl einseitige als auch zweiseitige Pfeile zeichnen.

1. Wähle in den Formwerkzeugen Arrow (Pfeil) aus oder drücke die Tastenkombination ⇧ + L:

   

2. Klicke auf eine Stelle in der Arbeitsfläche und ziehe den Cursor, um den Pfeil zu erstellen. Du kannst den Cursor in der Arbeitsfläche bewegen, um die Richtung zu ändern.
3. Wie beim Linienwerkzeug (oben) kannst du auch hier mit Stroke (Strich) den Stil der Konturen anpassen.

Einzelnen Abschluss hinzufügen oder ändern

1. Doppelklicke auf die Linie, um den Vektorbearbeitungsmodus zu aktivieren.
2. Wähle den Punkt aus, an dem der Abschluss hinzugefügt werden soll. Wichtig ist, dass du das Verschiebewerkzeug V verwendest.
3. Du kannst mehrere Punkte in einer Form auswählen, indem du auf die Form klickst und den Cursor ziehst oder die folgenden Tasten drückst:
   • Windows: Alt
   • macOS: Umschalt
4. Öffne das Menü Advanced Stroke (Erweiterter Strich), indem du im Bereich Stroke (Strich) auf die drei Punkte klickst:
5. Wähle in der Dropdown-Liste Cap (Abschluss) den gewünschten Abschluss aus: 

Ellipsenwerkzeug

Mit dem Ellipsenwerkzeug kannst du Ovale und Kreise zeichnen. Du hast die Möglichkeit, diese in der ursprünglichen Form zu verwenden oder durch Einfügen von Kurven anzupassen.

1. Wähle in den Formwerkzeugen Ellipse aus oder drücke die Taste O:

   

2. Klicke auf eine Stelle in der Arbeitsfläche und ziehe den Cursor, um die Ellipse zu erstellen. Die Abmessungen der Form werden unter dem Objekt blau angezeigt:

   

3. Um die Ellipse wird ein blauer Begrenzungsrahmen mit einem Ziehpunkt in jeder Ecke angezeigt. Damit kannst du die Größe der Form nach deinen Wünschen anpassen.

Polygonwerkzeug

Mit dem Polygonwerkzeug kannst du eine geschlossene Form mit einer beliebigen Anzahl gerader Linien zeichnen.

Standardmäßig wird mit dem Polygonwerkzeug ein Dreieck eingefügt. Du kannst dem Objekt jedoch zusätzliche Punkte hinzufügen, um benutzerdefinierte Polygone zu erstellen.

1. Wähle in den Formwerkzeugen Polygon aus:

   

2. Klicke auf eine Stelle in der Arbeitsfläche und ziehe den Cursor, um das Polygon zu erstellen. Die Abmessungen der Form werden unter dem Objekt blau angezeigt.
3. Um die Form wird ein blauer Begrenzungsrahmen mit einem Ziehpunkt in jeder Ecke angezeigt. Damit kannst du die Größe der Form nach deinen Wünschen anpassen.
4. Doppelklicke auf das Polygon, um den Vektorbearbeitungsmodus zu aktivieren. Jetzt kannst du dem Polygon weitere Punkte hinzufügen und jeden Punkt einzeln bearbeiten:
   

   

5. Wie bei Rechtecken kannst du auch bei Polygonen die Ecken abrunden:
   1. Hover mit dem Mauszeiger über dem Ziehpunkt in der Ecke, bis ein Kreis angezeigt wird: 
   2. Klicke auf den Ziehpunkt, und ziehe ihn in Richtung der Mitte des Objekts, um die Ecken abzurunden.

Polygone und Begrenzungsrahmen

Du hast vielleicht bemerkt, dass unterhalb des Polygons (in diesem Fall ein Dreieck) ein gewisser Abstand zum blauen Begrenzungsrahmen ist.

Der Begrenzungsrahmen behält dadurch eine konsistente Form oder Größe bei, wenn dem Polygon weitere Punkte hinzugefügt werden.

Um den Begrenzungsrahmen an die tatsächliche Größe der Form anzupassen, wähle die Option Flatten (Reduzieren). Klicke zum Aufrufen der Option mit der rechten Maustaste auf die Form und wählen Flatten (Reduzieren). Oder verwende die folgende Tastenkombination:

• Mac:   Command-E
• Windows:   Strg + E

Sternwerkzeug

Das Sternwerkzeug erzeugt Polygone, die in einer Sternform angeordnet sind. Standardmäßig wird mit dem Sternwerkzeug ein Stern mit 5 Zacken und 10 Seiten erstellt.

1. Wähle in den Formwerkzeugen Star (Stern) aus:

   

2. Klicke auf eine Stelle in der Arbeitsfläche und ziehe den Cursor, um den Stern zu erstellen:

   

3. Es gibt jetzt drei Ziehpunkte, mit denen du den Stern ändern kannst:
   • Mit Count (Anzahl) legst du die Anzahl der Zacken des Sterns fest (mindestens 3, maximal 60): 
   • Mit Ratio (Seitenverhältnis) legst du den Abstand der inneren Punkte des Sterns zur Mitte fest. Dies wird als Prozentsatz des Gesamtdurchmessers des Sterns angezeigt.
   • Mit Radius kannst du die Zacken ähnlich wie mit Corner Radius (Eckradius) bei Rechtecken abrunden.

Tipp! Im Vektorbearbeitungsmodus kannst du den Radius jeder Zacke individuell anpassen.

Häufig gestellte Fragen

Wir haben einige Antworten auf die am häufigsten gestellten Fragen zu Formen zusammengestellt.

Eckradius anpassen

Neben den regulären Ziehpunkten wird bei Rechtecken zusätzlich auf der Innenseite jeder Ecke ein Kreisgriff angezeigt. Mit diesen Ziehpunkten kannst du die Ecken des Rechtecks abrunden. In diesem Artikel erfährst du mehr über das Anpassen und Glätten des Eckradius.

Gestrichelte Linien erstellen

1. Zeichne eine Linie oder wähle eine Linie aus, die du gestrichelt darstellen möchtest.
2. Klicke im Eigenschaften-Bedienfeld im Abschnitt Stroke (Strich) auf die drei Punkte, um die Option Advanced Stroke (Erweiterter Strich) zu öffnen:
3. Du kannst sowohl die Länge der Striche als auch den Abstand dazwischen festlegen.
4. Gib diese im Feld „Dashes“ (Striche) im Format Strich,Abstand ein. Um beispielsweise einen Strich mit einer Länge von 5 px und einem Abstand von 2 px zu erstellen, gib „5,2“ ein.

Doppelseitigen Pfeil erstellen

So erstellst du einen doppelseitigen Pfeil:

1. Wähle den Pfeil in der Arbeitsfläche aus.
2. Doppelklicke auf den Pfeil, um den Vektorbearbeitungsmodus zu aktivieren.
3. Wähle den Punkt am anderen Ende des Pfeils aus.
4. Wähle unter „Advanced Stroke“ (Erweiterter Strich) im Feld „Cap“ (Abschluss) den gewünschten Pfeiltyp aus.

Halbkreis erstellen

So verwandelst du einen Kreis in einen Halbkreis:

1. Drücke die Taste O, um das Ellipsenwerkzeug auszuwählen.
2. Halte die Umschalttaste gedrückt, während du klickst und ziehst, um einen ordentlichen Kreis zu erstellen.
3. Doppelklicke in die Form, um den Vektorbearbeitungsmodus zu aktivieren.
4. Wähle einen der vier Hauptpunkte aus und drücke Entf.
5. Um den Halbkreis zu schließen, drücke die Taste P, um das Stiftwerkzeug auszuwählen.
6. Klicke auf jeden offenen Punkt im Halbkreis, um die Form zu schließen.

In diesem Artikel erfährst du mehr über das Bearbeiten von Formen und Objekten.

Bogenwerkzeug verwenden

Du kannst mit dem Ellipsenwerkzeug auch andere Formen wie Kreisdiagramme, Kreise und offene Kreise erstellen:

In diesem Artikel erfährst du mehr über das Verwenden des Bogenwerkzeugs.