CSS Code: Schrift mit Farbverlauf versehen

In einigen Situationen macht es Sinn (oder ist gewünscht), sein Bild, das man in der Desktop-Ansicht in voller Breite anzeigen lassen möchte, auf Mobil jedoch proportional deutlich kleiner anzeigen zu lassen. In diesem Artikel erfährst du, wie du mit einem einfachen CSS Code genau das erreichen kannst.

 

CSS TUTORIAL

Headlines und andere Texte mit Farbverlauf versehen

  1. Erstelle einen Text oder eine Headline, die du mit einem Farbverlauf versehen möchtest.
  2. Öffne im FunnelBuilder im Text-Element den Tab "CSS" und füge den untenstehenden CSS Code ein.
  3. Ändere am Code jeweils nur die 2 Verlaufsfarben rgba(127,164,236,1) und rgba(56,83,134,1). 
  4. Sobald die Farben für dich passen, speichere deine Funnelseite und fertig!

 

CSS Code: Textfarbe in Verlauf ändern

Nutze den folgenden Code an allen Stellen, an denen du deiner Schrift einen Farbverlauf geben möchtest.

-webkit-text-fill-color: transparent; background: linear-gradient(0deg, rgba(127,164,236,1) 0%, rgba(56,83,134,1) 100%); -webkit-background-clip: text;

 

Hinweis: Klicke auf den Code um ihn automatisch in die Zwischenablage zu kopieren.