CSS-Gradient-Generator: Linear, radial, konisch – kostenlos
Kostenlos, ohne Anmeldung, läuft in deinem Browser. Gestalte einen linearen, radialen oder konischen Farbverlauf mit bis zu 8 Farbstopps, sieh ihn live und kopiere das CSS. Lade ihn als PNG-Hintergrund in gängigen Größen herunter.
Farbstopps
CSS
background: #ff7ac6; background: linear-gradient(135deg, #ff7ac6 0%, #ffe14d 100%);
Die erste Zeile ist eine Vollfarbe für sehr alte Geräte, die keine Verläufe anzeigen können.
Mit einer Vorlage starten
Auf deinem Gerät erstellt.
Warum CSS-Verlaufsgenerator nutzen
- 100 % kostenlos
- Nutze es so oft du willst. Ohne Anmeldung, ohne Wasserzeichen, ohne Installation.
- Privat von Grund auf
- Was du eingibst, bleibt in deinem Browser und wird nie an uns gesendet.
- Läuft auf jedem Gerät
- Läuft in deinem Browser unter Windows, Mac, Linux, Android und auf dem iPhone. Keine App nötig.
So nutzt du CSS-Verlaufsgenerator
- Wähle linear, radial oder konisch und lege die Richtung fest.
- Wähle Farben und zieh jeden Stopp an seine Position.
- Kopiere das CSS oder lade den Verlauf als Bild herunter.
Häufige Fragen
- Wie verwende ich das CSS?
- Füge es in die Regel für das Element ein, das du einfärben möchtest. Die erste Zeile ist eine einfarbige Fallback-Farbe, die zweite der Verlauf.
- Was ist der Unterschied zwischen linear, radial und konisch?
- Linear verläuft entlang einer geraden Linie, radial breitet sich von der Mitte aus, und konisch dreht sich wie ein Farbkreis um die Mitte.
- Kann ich Transparenz verwenden?
- Ja. Gib eine Farbe wie rgba(47, 91, 255, 0.5) in einen Stopp ein.
- Wird etwas hochgeladen?
- Nein. Verläufe werden auf deinem Gerät erstellt.
- Ist CSS-Verlaufsgenerator kostenlos?
- Ja. Die Nutzung ist kostenlos, ohne Anmeldung und ohne Installation.
Ähnliche Tools
- Farbpaletten-GeneratorErzeuge Farbpaletten auf Tastendruck, fixiere die Farben, die dir gefallen, oder baue eine Palette aus einer Grundfarbe mit analogen, komplementären oder triadischen Harmonien. Export als CSS-Variablen, Tailwind oder JSON.
- HEX-in-RGB-FarbrechnerRechne eine Farbe in einem Schritt zwischen HEX, RGB, HSL, HSV und CMYK um, inklusive Transparenz. Füge einen Code in einem beliebigen Format ein oder wähle eine Farbe, kopiere dann das benötigte Format und prüfe den Textkontrast.
- Farbkontrast prüfenPrüfe mit dem WCAG-Kontrastverhältnis, ob Text auf seinem Hintergrund lesbar ist, sieh die AA- und AAA-Ergebnisse für normalen Text, großen Text und Bedienelemente und erhalte die nächstgelegene Farbe, die besteht.