✨ bling text for the 21st century ✨

webfonts (ligatures!), CSS transforms, live editing!

Using

Write some bling text. Modify it as you please. Click the GIF button to get a GIF. ✨

🐞 This is a buggy work in progress, things will break. GIF Markup output is TODO. 🐞

3rd party code Ɛ̸ assets

This project uses a variety of 3rd party resources to bling it up.

Building

1. npm install
2. npm run start dist

This will output a dist/ directory to be served from a static server's root.

(Its dist/.workspace/ directory contains intermediate build artifacts that are not necessary for deployment.)

Active development

To build, watch and serve on port :8000, run:

npm run start

Tools

Texture frame extractor

In order to manipulate GIF playback at a frame level on the client, this project extracts frames from the animated textures into base64-encoded sequences of plain GIFs wrapped in a JSON format.

The texture frame extractor requires exiftool and gifsicle installed on the local PATH. On macOS, these can be easily installed with Homebrew:

brew install gifsicle exiftool

Once installed, textures can be rebuilt via:

npm run start textures

Documentation generator

A documentation generator is bundled as part of the build system, runnable via:

npm run start docs

This generates the attributions on 3p/README.md and an empty README.md file for every top-level directory that doesn't contain one.