Verlaufstext füllt Buchstaben mit einer sanften Farbmischung per background-clip: text — der Effekt hinter unzähligen Hero-Headlines und Landingpages. Mit Animation fließt der Verlauf langsam durch die Buchstaben.
Text eingeben, zwei Farben und einen Winkel wählen, Glanz-Animation einschalten, CSS kopieren. Die Ausgabe enthält die Vendor-Prefixe und funktioniert browserübergreifend.
Frequently Asked Questions
Q: Warum wird mein Verlauf im Browser nicht angezeigt?
Warum wird mein Verlauf im Browser nicht angezeigt? Der Trick braucht -webkit-background-clip: text und -webkit-text-fill-color: transparent. Beides ist enthalten — prüfen Sie, ob ein CSS-Minifier es entfernt hat.
Q: Funktioniert Verlaufstext in allen Browsern?
Funktioniert Verlaufstext in allen Browsern? Ja — Chrome, Edge, Safari und Firefox unterstützen background-clip: text. Sehr alte Browser zeigen eine Vollfarbe, wenn zuvor ein Fallback gesetzt wird.
Q: Kann ich ihn für Buttons nutzen?
Kann ich ihn für Buttons nutzen? Ja, aber Buttons tragen Aktionen: bevorzugen Sie ein einfarbiges Label mit hohem Kontrast und reservieren Sie Verlaufstext für Überschriften und Dekor.
Q: Wie füge ich mehr als zwei Farben hinzu?
Wie füge ich mehr als zwei Farben hinzu? Bearbeiten Sie den linear-gradient in der Ausgabe und ergänzen Sie Farbstopps, z. B. linear-gradient(90deg, red, yellow, blue).
Q: Ist das gut für SEO und Barrierefreiheit?
Ist das gut für SEO und Barrierefreiheit? Der Text bleibt echtes HTML, SEO ist unbeeinflusst. Halten Sie den Kontrast hoch und vermeiden Sie Verlaufstext im Fließtext.
Bauhaus-Farben
Die Bauhaus-Schule definierte die moderne Farbtheorie: Primärfarben als Werkzeuge, klare Kontraste statt Ornamente. Diese Palette zitiert die ikonischen Farben von Weimar, Dessau und der deutschen Designgeschichte.
Bauhaus Rot #BE1E2DDas ikonische Rot der Bauhaus-Plakate und Drucksachen
Bauhaus Gelb #FFDE17Das leuchtende Gelb der Bauhaus-Ästhetik
Bauhaus Blau #00509EDas tiefe Blau des Bauhaus-Farbkreises
Ultramarin #120A8FHistorisches Pigment aus Lapislazuli, von Goethe beschrieben
Ocker #C78B2CErdpigment der deutschen Renaissance-Malerei
Petrol #006D7CDas Blaugrün der Nachkriegszeit und des Mid-Century-Designs
Lindgrün #7CBA3DDas frische Grün der Frühlingslinden
Ziegelrot #B22222Die roten Ziegeldächer der Altstädte
Graphit #38383ADer dunkle Grauton der Zeichenkunst und des Industriedesigns
Weiß #F4F4F4Das Weiß der Bauhaus-Wände — Raum und Licht
Q: Was sind Bauhaus-Farben?
Was sind Bauhaus-Farben? Die Bauhaus-Farben sind die Primärfarben Rot (#BE1E2D), Gelb (#FFDE17) und Blau (#00509E) sowie Schwarz und Weiß. Die Schule (1919-1933) nutzte sie als systematische Farbenlehre statt dekorativer Ornamente.
Q: Was ist Ultramarin?
Was ist Ultramarin? Ultramarin (#120A8F) ist ein historisches blaues Pigment, ursprünglich aus dem Halbedelstein Lapislazuli gewonnen. Es war teurer als Gold und wurde für Madonnen-Mäntel in der Renaissance reserviert.