Bungee Spice

Derivative of DJR's Bungee (djr.com/bungee) made to demonstrate COLRv1 gradients.

Hacked up copy with COLRv1 gradients

This repository contains a simple hack on Bungee to add gradients for the purpose of demonstrating COLRv1.

python scripts/make_gradient_colrv1.py fonts/Bungee_Color_Fonts/BungeeColor-Regular_colr_Windows.ttf

Note the use of two gradients in opposing direction within a single glyph. To make your own variant, perhaps going between light and dark blue:

Build your own copy

Establish a virtual environment your favorite way

# For example
python3 -m venv venv
source venv/bin/activate
pip install fonttools

Change the gradient colors

Edit scripts/make_gradient_colrv1.py, for example:

# BEFORE, red to gold
cpal.palettes[0].append(color('#ffd700'))
cpal_red = 0
grad_c1 = cpal_red
grad_c2 = 2
cpal.numPaletteEntries = len(cpal.palettes[0])

# AFTER, blue to pinkish
cpal.palettes[0].append(color('#4000fa'))
cpal.palettes[0].append(color('#ff095'))
cpal_red = 0
grad_c1 = 2
grad_c2 = 3
cpal.numPaletteEntries = len(cpal.palettes[0])

Rebuild the font binary and test the result:

python scripts/make_gradient_colrv1.py fonts/Bungee_Color_Fonts/BungeeColor-Regular_colr_Windows.ttf
python -m http.server 8010

Open http://localhost:8010/test.html in a browser, it should look something like this:

If you try this out and want to share we'd love it if you'd send us a screenshot at https://twitter.com/googlefonts. If you get stuck please file an issue here.

Specimen

TODO link when one exists :)

License

Bungee Spice is released under the SIL Open Font License. This license is available with a FAQ at http://scripts.sil.org/OFL