How to Create Custom Animated Text and Download It as GIF or WebP

Updated

Open Textanim (textanim.com), type your text into the input field, then adjust font, size, outline, background, shadow, animation direction, and speed until the preview looks right. When it does, use DOWNLOAD GIF, DOWNLOAD WEBP, or SHARE GIF / GET LINK to export or share the result. The whole workflow runs in the browser, and the tool supports multi-line text at up to 60 characters per line, so it works for titles, quotes, and layered messages rather than just single words.

Before You Start

  • Text limit: 60 characters per line. Longer lines need to be split manually.
  • Language support: Textanim states it works with almost all languages, including special characters, accents, and right-to-left scripts via Unicode. If a glyph looks wrong in the preview, it will look wrong in the export.
  • Fonts: The font list is fixed (Cornerstone, Arial, Verdana, Impact, Bebas, PressStart2P, Creepster, and others). You cannot upload your own font file.
  • Output formats: GIF and WebP. The site notes that WebP exports are smaller and load faster than GIF, and that it automatically exports in WebP for optimal performance — so treat WebP as the default choice unless a platform specifically requires GIF.

Step-by-Step: Build the Animation

1. Enter your text

Type into the Your Text field. The counter shows characters used against the 60 limit. For a multi-line title, press Enter to start a new line — each line is counted separately.

2. Set size and font

  • Text Size: a numeric value (the default shown is 60). Larger values fill more of the canvas.
  • Font Family: pick from the dropdown. Display fonts like Impact, Bebas, Monoton, or PressStart2P give a stronger animated-title look; Arial, Verdana, or Georgia are safer for readability.

3. Style the text

  • Background Color and Outline Color pickers.
  • Outline Size: a decimal value (default 0.5) — raise it for bold outlines on busy backgrounds, lower it or set near zero for a clean look.
  • Shadow: toggle on if the text needs separation from the background.

The About page also mentions hundreds of background patterns in addition to solid colors, which is useful when a plain background makes the animation look flat.

4. Choose direction and speed

Direction options include:

  • Bottom right to Top
  • Top to Bottom
  • Bottom to Top
  • Left to Right
  • Right to Left
  • Top right to Bottom

Animation Speed is a numeric slider (default 50). Lower values slow the scroll, which usually reads better for quotes; higher values suit short social clips.

5. Preview, then export

Watch the live preview. When it matches your intent:

  • DOWNLOAD GIF — for platforms or tools that only accept GIF.
  • DOWNLOAD WEBP — smaller file, faster loading; the better default for websites and modern social platforms.
  • SHARE GIF / GET LINK — produces a shareable link instead of a file.
  • SAVE LOCALLY — stores the design in the site's saved list, capped at 10 saved animated texts.

Choosing Between GIF and WebP

GIF WebP
File size Larger Smaller (site states this explicitly)
Loading speed Slower Faster
Best for Legacy tools, platforms that reject WebP Websites, social media, presentations
Availability here Yes Yes

Pick GIF only when a destination won't accept WebP. Otherwise WebP gives you the same animation with less weight.

Common Problems and Fixes

  • Text gets cut off or wraps oddly: you've hit the 60-character line limit. Shorten the line or split it into two lines.
  • Characters render as boxes or blanks: the chosen font lacks those glyphs. Switch to a broadly supported font (Arial, Verdana, Times New Roman) and re-check the preview before exporting.
  • Export file is too large for a platform: switch from GIF to WebP, reduce text size, or simplify the background.
  • Animation feels too fast or jerky: lower the Animation Speed value and re-export.
  • Saved designs disappeared: the saved list holds a maximum of 10 items — download anything you want to keep rather than relying on the site storage.
  • Right-to-left text looks reversed: confirm the script renders correctly in the preview first; if it doesn't, try a different font family before exporting.

When This Tool Fits

Textanim is a good fit when you need a quick animated title, quote card, or layered message for social media, a website, or a slide deck, and you're happy working within its fixed font list and 60-character line limit. If you need custom typefaces, longer paragraphs, or video formats beyond GIF/WebP, this generator won't cover it — plan to build the animation elsewhere. For inspiration before starting, the site's Gallery has ready-made templates you can browse for direction and speed combinations.