glitch text scripts documentation

last revised: may 31, 2015

In recent years, artists such as Glitchr have helped popularize a certain style of "glitch text" that revolves around the use of combining diacritical marks. These marks are highly stackable, and stacking large numbers of them can lead to interesting/unexpected results.

These scripts use (pseudo)random numbers to rapidly generate this type of glitch text. The accompanying HTML5 glitch text generator can be used to generate glitch text for copy-pasting to social media, or as an art canvas for creating text art.

Update: for stripped-down versions of these scripts designed for online mouseovers, go here.

glitch-text-scripts.js currently contains three scripts for adding random diacritical marks to text:

Each of these scripts takes up to four arguments:

  1. id1 is the ID of the element containing the text you want to glitch. This can be an <input> or a standard HTML element such as <p>, <a>, <span>, etc. This argument is required.
  2. id2 is the ID of the element where you want to output the glitched text. If this is left blank, then is is assumed that you want to replace the source text with the glitched text, and id1 is used.
  3. Pass true to the isInput argument to tell the script that the source text is coming from an <input> element (or I guess <select>). For example, my glitch text generator uses form inputs like these to print to the screen in real-time. Leaving this argument blank (or passing any value that doesn't resolve true) indicates that the source text is coming from a standard HTML element.
  4. Pass true to the copyBack argument if you're using different source and output elements, and you want the glitched text to be "copied back" into the source element and replace its content. This could be important if working with form inputs, for example (it's crucial to my HTML5 glitch text generator). Leaving this blank (or passing any value that doesn't resolve true) means you don't want or need this.

There are also two "precise" scripts, which allow the user to choose which diacritic to use instead of picking one at random.

There are also "scramble" scripts that replace each character in the source text with a different random character:

Update: the glitchAll and Randomize scripts have a new attribute. This optional attribute (last in attribute list) is skipSpace; pass it true to make these scripts recognize and skip space characters (&#20;). This is handy for maintaining word wrap.

glitch-text-scripts.js also contains four helper scripts that the base scripts rely upon:

Terms of [mis]use

You may use glitch text and text art that you create using the HTML5 glitch text generator in any way. It's your art; I just made the tool. If you choose to publish your art, it would be great if you could include a link to Also, I'd love it if you submitted your screenshots, animated gifs, etc to the glitch text tumblr at

You may use the glitch text scripts in your own projects. If you do, it's better for me if you upload the file to your own server than if you link to my server. You may alter the scripts if your project requires it, but don't try to pass it all off as your own work, because that would be a total jerk move. Also, don't try to make money off these scripts without cutting me in on the deal, because that's not cool, either.

If you use the scripts in a project, it would be great if you could include a link to If you do something interesting with these scripts or expand them in some cool way, I'd love if you let me know by emailing me at or submitting a link to the glitch text tumblr at


I'm not a professional programmer and my code is probably lousy with bugs and unintended errors (the bad kind, I mean). Likewise, there are probably some amazing features that I could add to the scripts or the HTML5 generator that I haven't thought of. Shoot me an email at with your comments, code suggestions, questions, kudos, or other laudations. Hate mail should be sent directly to the trash.