[Feature]: Add Multi-Color Gradient Text Animation Support

Author: SwoozlehumpCreated Jul 11, 2026Updated Jul 11, 2026
Labelsenhancement

Is your feature request related to a problem?

Currently, the typing SVG only supports single solid colors for text. Many users want to showcase more visually stunning profiles with gradient text that cycles through beautiful color combinations as the text animates. This would make profiles stand out and allow for more creative customization possibilities.

Describe the solution you'd like

Add support for gradient text animations with the following capabilities:

Features:

  • Multi-color gradient text support (linear, radial, conic)
  • Ability to specify gradient colors and stop positions via URL parameters
  • Smooth gradient animation (optional: gradient can shift/rotate during typing animation)
  • Preset gradient options for easy use (e.g., gradient=sunset, gradient=ocean, gradient=neon)
  • Custom gradient direction control (horizontal, vertical, diagonal)

Example Usage:

?text=Hello+World&gradient=custom&gradientColors=FF6B6B,4ECDC4,45B7D1&gradientAngle=45

This would allow users to create eye-catching README profiles with minimal configuration.

Describe alternatives you've considered

  • CSS filter effects on wrapper elements (limited control, external workaround)
  • SVG text shadow stacking (performance-heavy, not true gradients)
  • Multiple overlapping text layers (complex, hard to maintain sync during animation)
  • Using external services (loses the simplicity and performance of readme-typing-svg)

Additional context

This feature would dramatically increase the visual appeal of user profiles and repositories. Many competitors and alternatives already support gradient text, and adding this feature would make readme-typing-svg the go-to choice for animated text on GitHub.

The SVG format natively supports gradients via <defs> and <linearGradient> elements, so implementation should be feasible with the existing PHP/JavaScript/CSS stack.

Source: DenverCoder1/readme-typing-svg