So erstellen Sie einen Farbverlauf in Figma
Wenn Sie sich nicht für eine Farbe entscheiden können, sind Farbverläufe eine hervorragende Option. In Figma können Sie verschiedene Verlaufshintergründe erstellen, einer Form und einem Text einen Verlauf hinzufügen, Strichverläufe erstellen und vieles mehr. Sie können sogar Netzverläufe mit dem Unschärfeeffekt oder mit einem Mesh-Verlaufs-Plugin der Figma-Community erstellen.
Da Figma so viele verschiedene Möglichkeiten zum Erstellen eines Verlaufs bietet, könnte es für neue Benutzer schwierig sein, sie alle von Anfang an zu verstehen. Natürlich gehört auch das Experimentieren zum Lernprozess, aber es ist viel einfacher, alle Anleitungen an einem Ort zu haben. Und genau das bietet dieser Artikel.
So erstellen Sie verschiedene Verlaufsstile in Figma
Figma bietet verschiedene Verlaufsstile, mit denen Sie Hintergründe oder Objekte auf der Leinwand mit mehreren Farben füllen können.
Linear: Lineare Farbverläufe haben zwei Farben, die in einer geraden Linie ineinander übergehen.Radial: Bei radialen Farbverläufen die erste Die Farbe beginnt an einem einzelnen Punkt und geht in alle Richtungen in den anderen über.Winkelig: Bei Winkelverläufen können Sie die Richtung bestimmen, in die sich der Verlauf bewegt, indem Sie Winkel hinzufügen. Dies ist eine hervorragende Option zum Erstellen von 3D-Bildern.Diamant: Wie der Name schon sagt, beginnen Diamantverläufe an einem Punkt und breiten sich in Form einer Raute aus.
Die Schritte zum Erstellen eines dieser Verläufe Stile sind gleich. Der einzige Unterschied besteht im gewählten Stil. So erstellen Sie ein Verlaufsdesign in Figma:
Öffnen Sie eine leere Figma-Datei.
Tippen Sie in der linken Symbolleiste auf das „Rechteck-Werkzeug“.
Zeichnen Sie mit dem Werkzeug ein Rechteck auf der Leinwand, das Sie als Verlaufsreferenz verwenden möchten.
Wählen Sie das erstellte Rechteck aus.
Klicken Sie auf Aktuelle Farbe unter „Füllen“ im rechten Bereich, um die Farbauswahl zu öffnen.
Drücken Sie auf das Dropdown-Menü und ändern Sie die Standardeinstellung „Durchgehend“ in den gewünschten Verlaufsstil. Es werden zwei farbige Stopps oder Kästchen angezeigt.
Wählen Sie jeden Farbstopp aus und wählen Sie die Farbe aus, die Sie dem Farbverlauf hinzufügen möchten.
Tippen Sie auf die vier Punkte neben „Füllen“, um den Farbverlauf als Stil zu speichern.
Danach können Sie den Transparenzwert anpassen, die Farbstopps dort positionieren, wo eine Farbe enden soll, und die Beginnen Sie mit dem zweiten, fügen Sie einen weiteren Farbstopp hinzu, verschieben Sie sie auf der Leinwand oder ändern Sie den Verlaufswinkel. Wenn Sie mit der Anpassung fertig sind, speichern Sie den Verlauf erneut (Schritt 8).
Hinweis: Um einen von Ihnen hinzugefügten Farbstopp zu löschen, wählen Sie den Stopp aus und drücken Sie „Löschen“ oder „Rücktaste“ auf Ihrer Tastatur.
Jetzt können Sie den Verlaufsstil auf jedes gewünschte Objekt anwenden.
So erstellen Sie einen Mesh-Verlauf in Figma
Mesh-Verläufe sind bei großen Unternehmen und Marken beliebt. Wenn Sie häufig Instagram nutzen, sehen Sie jeden Tag das Logo der App. Daher kann es in Situationen hilfreich sein, zu wissen, wie man sie erstellt, wenn Sie Ihren Projekten etwas Interessantes verleihen möchten.
Wie bereits erwähnt, können Netzverläufe mit einem Plugin, bereitgestellt von der Figma-Community. Es gibt jedoch eine einfachere Möglichkeit, mehrere Farben an beliebiger Stelle auf Ihrer Leinwand hinzuzufügen, ohne dass externe Tools erforderlich sind.
So erstellen Sie einen Netzverlauf in Figma:
Geben Sie eine neue Figma-Datei ein. 
Rahmen erstellen.
Aktivieren Sie das Kästchen „Inhalt ausschneiden“ im rechten Bereich, damit alles, was außerhalb des Rahmens liegt, abgeschnitten wird.
Beginnen Sie mit dem Hinzufügen verschiedener Formen oder erstellen Sie Ihr eigenes Objekt mit dem „Stift“-Werkzeug innerhalb des Rahmens.
Ändern Sie die „Ausfüllung“ jedes neuen Formulars, sodass es unterschiedlich ist vom Rest.
Alle Formen auswählen.
Drücken Sie unter „Effekte“ auf das Dropdown-Menü und wählen Sie „Ebenenunschärfe“ aus.
Öffnen Sie die Einstellungen für „Ebenenunschärfe“ und erhöhen Sie den Wert, bis Sie keine klaren Grenzen mehr zwischen den Formen sehen.
Speichern Sie den Stil wie oben und verwenden Sie ihn es auf andere Objekte anwenden.
Eine andere Möglichkeit, einen Netzverlauf zu erstellen, ist die Verwendung des Winkelstils. Es liefert ein etwas anderes, aber ebenso interessantes, faszinierendes Ergebnis wie das erste Tutorial.
Das müssen Sie tun:
Öffnen Sie eine leere Leinwand.
Verwenden Wählen Sie die gewünschte Form aus und fügen Sie sie der Leinwand hinzu. Ändern Sie unter „Füllen“ „Fest“ in „Winkel“.
Wählen Sie die Farben für den Farbverlauf.
Passen Sie den Winkel und andere Aspekte des Farbverlaufs an.
Fügen Sie eine weitere Form hinzu, vorzugsweise „Eclipse“, also einen Kreis.
Legen Sie es übereinander Form auf der Leinwand.
Fügen Sie einen linearen Farbverlauf hinzu und ändern Sie die Farbe in die Farbe, die gut zum Rest passt.
Verwenden Sie unter „Effekte“ die Option „Ebenenunschärfe“.”-Effekt und verwischen Sie die Linien der neuen Form, um sie mit der ersten zu verschmelzen.
So erstellen Sie einen Farbverlauf für ein Bild in Figma
Abgesehen von der Erstellung eines Farbverlaufs, Sie können auch ein vorhandenes Bild mit einem Farbverlauf überlagern, um ihm eine gewisse Dimension zu verleihen. Dadurch erhält es einen „Fade“-Effekt oder die Illusion einer unsichtbaren Lichtquelle, die von außen auf das Bild scheint.
So fügen Sie einem Bild in Figma einen Farbverlauf hinzu:
Öffnen Sie ein neues Datei in Figma.Ziehen Sie das Bild, dem Sie den Farbverlauf hinzufügen möchten, per Drag & Drop auf die Leinwand.
Fügen Sie eine Form hinzu, die der Größe von entspricht das Bild oben.
Wählen Sie im Abschnitt „Füllen“ einen Verlaufsstil aus.
Wählen Sie die Farben des Farbverlaufs aus der Farbauswahl.
Deckkraft, Winkel usw. anpassen.
Sie können auch das „Stift“-Werkzeug verwenden und eine Form in den Bereich zeichnen, in dem Sie sich befinden möchten, dass der Farbverlauf so ist.
So erstellen Sie einen Farbverlauf für einen Text in Figma
Das Erstellen eines Farbverlaufs für einen Text in Figma ähnelt ziemlich der Erstellung eines Farbverlaufs für jede andere Form. Hier sind die Schritte:
Öffnen Sie eine neue Leinwand in Figma.Drücken Sie in der Symbolleiste links auf das Werkzeug „Text“.
Klicken Sie irgendwo auf die Leinwand und beginnen Sie mit dem Schreiben. Wählen Sie den Text aus und gehen Sie zu „Füllen“.
Wählen Sie den Verlaufsstil.
Drücken Sie jeweils Klicken Sie auf das Farbfeld und suchen Sie die Farbe, die Sie dem Farbverlauf hinzufügen möchten.
FAQs
Wie viele Farben kann ich einem Farbverlauf in Figma hinzufügen?
Sie können sowohl im Standard-als auch im Mesh-Figma-Verlaufsstil so viele Farben hinzufügen, wie Sie möchten. Aber versuchen Sie, es nicht zu übertreiben. Da Farbverläufe mehrere Übergangsfarben haben, könnten mehr als fünf zu viel sein, selbst für einen Mesh-Farbverlauf.
Kann ich einen Farbverlauf in Figma importieren?
Sie können jeden gewünschten Farbverlauf importieren in Figma. Sie können beispielsweise Code aus CSS (Cascading Style Sheets) einfügen, indem Sie das Bedienfeld „Code“ öffnen und den Code einfügen. Sie können auch Verläufe aus Adobe Illustrator importieren.
Wo finde ich kostenlose Figma-Verläufe?
Kostenlose und kostenpflichtige Figma-Verläufe finden Sie in der Figma-Community. Es bietet Funktionen Eine Fülle wunderschöner und einzigartiger Designs, die von Figma-Benutzern erstellt wurden. Sie können nach Plugins, Dateien und Widgets filtern. Geben Sie einfach „Gradient“ in die Suchleiste oben ein und finden Sie das Design, das Ihnen gefällt.
Holen Sie sich Ausgefallen mit farbenfrohen Farbverläufen
Farbverläufe sind eine hervorragende Möglichkeit, einem Design ein unverwechselbares und persönliches Design zu verleihen. Und Figma ermöglicht Ihnen einen sanften Übergang zwischen zwei oder mehr beliebigen Farben Ihrer Wahl. Übertreiben Sie es jedoch nicht. Mischen Sie Farben, die gut zusammenpassen, und versuchen Sie, innerhalb derselben Farbpalette zu bleiben.
Haben Sie bereits versucht, in Figma einen Farbverlauf zu erstellen? Teilen Sie uns in den Kommentaren unten mit, welchen Verlaufsstil Sie verwendet haben und wofür Sie ihn verwendet haben.
Haftungsausschluss: Einige Seiten dieser Website enthalten möglicherweise einen Affiliate-Link. Dies hat keinerlei Auswirkungen auf unsere Redaktion.