A node script and docker container for generating transparent PNGs of 90s MS Wordart.

Built on css3wordart written by Ari Rizzitano. Inspired by pythonWordArt written by zorbaproject. Also inspired by https://makewordart.com going offline. I figured it's time for everyone to generate their own Wordart locally 🙂
 

The node script parses command line arguments and uses regex to replace text in a template HTML file that will render the wordart when loaded in a browser. Puppeteer is used to load a headless version of Google Chrome and take a screenshot of the page with a transparent background. That screenshot is then trimmed by GraphicsMagick and saved to an output directory.
 

Using Node

To Wordart PNGs using nodejs:

1. Install nodejs and npm
2. Install GraphicsMagick
3. Clone the repo
4. npm install
5. npm test to see all design examples
6. node .\wordartOnDemand.js -w "Hello World" -a rainbow to generate a specific wordart

See usage with --help (-h) to see all supported styles.

Using Docker

⚠ Docker images are experimental. See the issues section for more information. It's best to use the NodeJS method for now.

If you don't want to install Node/NPM (or you like Docker better), you can generate Wordart PNGs using Docker. Note that this Docker image will take up ~1 GB, since it needs to download Chromium to render the image in a browser.

Docker Hub Image

You can utilize the prebuilt Docker image that is hosted on Docker Hub:

https://hub.docker.com/repository/docker/toastymallows/wordart-on-demand

docker run --rm -v ~/wordart/out:/wordart/out toastymallows/wordart-on-demand:latest -w "Hello World" -a rainbow

Your generated PNG should be located at /home/<user>/wordart/out (\\wsl$\<WSL 2 OS>\home\<wsl2 user>\wordart\out on Windows via WSL 2.)

Build Docker Image manually

If you'd prefer, you can build the Docker image manually.

Windows

1. Install Docker
2. Install and setup WSL 2
3. Install a WSL 2 Linux OS in Windows (I chose Ubuntu 20.04.1 LTS)
4. Open the WSL 2 command prompt
5. cd /mnt/<repo clone directory>
6. docker build -t wordart .
7. docker run --rm -v ~/wordart/out:/wordart/out wordart:latest -w "Hello World" -a rainbow
8. Your generated PNG should be located at \\wsl$\<WSL 2 OS>\home\<wsl2 user>\wordart\out (accessible from Windows Explorer)

Linux

1. Install Docker
2. docker build -t wordart .
3. docker run --rm -v ~/wordart/out:/wordart/out wordart:latest -w "Hello World" -a rainbow
4. Your generated PNG should be located at /home/<user>/wordart/out

Mac

Try it out and let me know! PRs welcome 🙂

Issues

There are some issues with Docker images:

• Impact font is not working, affecting some Wordart variations

For now, if you want accurate wordart, it's best to use the NodeJS approach.
 

• Allow changing output directory via command line argument (when running from Node)
• Allow making Wordart larger via command line argument