Gradient Text for GoHighLevel: Text & Headlines Widget | FunnelSlayer
Animated Elements
Text & Headlines

Gradient Text for GoHighLevel

Turn a plain headline into moving color. Build a seamless flow from as many as eight brand colors, send it across, down or diagonally through the letters, then carry the same motion around an optional glassy frame. The actual copy is always present and readable. The animation only moves its light.

Controls
67
Variants shown
6
Dependencies
None
Variants

6 ways to run it

Every one of these is the real element with different settings. Press play again to watch any of them from the start.

violet on dark
framed glass
electric spectrum
warm editorial
vertical yoyo
still custom angle
What you can control

67 controls, grouped the way you build

  • What it says3
  • Animation12
  • The gradient12
  • Gradient frame13
  • Text style10
  • Text finish7
  • Background & spacing10

Everything it does

  • Text and semantic heading role
  • letter case
  • always moving, hover-only or still
  • horizontal, vertical, diagonal or custom-angle travel
  • lap duration
  • yoyo or seamless loop
  • pause on hover
  • starting position
  • scroll/load entrance with replay, delay and timing
  • two to eight gradient colors
  • color spread, saturation and brightness
  • optional matching or custom gradient frame
  • frame thickness, padding, corners, inner color, glow and glass blur
  • desktop and mobile alignment
  • page, system, serif, mono or custom font
  • independent desktop/mobile size
  • weight
  • letter spacing
  • line height
  • italic
  • outline
  • text glow with color, strength, drop and softness
  • block padding, background + opacity, radius and border
  • adjustable frame rate
  • off-screen and hidden-tab pausing
Setup

How to add Gradient Text to a GoHighLevel page

  1. 01

    Open the element panel

    In the page builder, click the + button to add a new element.

  2. 02

    Go to Widget Marketplace

    In the left menu, select Widget Marketplace.

  3. 03

    Find Animated Elements

    Locate the Animated Elements widget by Funnelslayer in the installed apps list.

  4. 04

    Drag and drop it into the page

    Drop the widget where you want it. The Web Widget Settings modal opens on the element gallery: "Select an element to start with".

  5. 05

    Select an element and continue

    Choose an element (Animated Counter, Typing Animation, and more), then click Continue. Search by name or by what it does, or use the category rail on the left to narrow the list. You can switch elements later without losing your settings.

  6. 06

    Customize it

    Use the element's settings to customize everything to match your brand. The live preview updates as you go, with separate desktop and mobile views.

Questions

Common questions

Will animated text cause layout shift on my funnel?
No. Typing Animation locks the line width so the text does not jump as it types, and HyperText Scramble pins each letter’s width to its final glyph so the line never jitters while characters churn.
Can I animate only part of a headline?
Yes. Highlighter marks any phrase you wrap in asterisks and leaves the rest of the line alone, and Typing Animation keeps a fixed lead-in while only the closing phrase cycles.
Do these work as real headings for SEO?
Depth Text lets you choose the text role, so it can render as an h1, h2, h3, p or div. The other text elements render as regular text, so keep your page’s real heading structure in the builder’s own text elements.