In this repo there are a few basic css files you can use as starting points.
PNGTube uses the name of each image for its id (the # items in css) and applies the 'active' class (the . items in css) when audio is detected.
You can replicate this behavior in the test links by clicking on the window to toggle the active class.
basic.css
test
All other files are based on this one, which changes the opacity of the 'active' and 'idle' images based on voice activity
brightness.css
test
This file lowers the brightness of the idle image
bounce.css
test
This file adds a bounce animation when speaking starts
blink.css
test
This file adds a blink animation, and requires active-blink and idle-blink images.
reactive.ss
test
This file simply combines the brightness and bounce files to replicate the Reactive by FugiTech style.
hide.css
test
This file hides all images below the viewport during silence