Live Product · Streaming Tools
Streaming donation widget system
A complete set of live-overlay widgets for streamers — donation alerts, recent donors, and top supporters — each with four fully distinct visual themes that match any channel aesthetic.
3
Widget types
4
Visual presets
3
Independently deployed repos
Overview
Three independent React + Vite apps embedded as OBS/Streamlabs browser sources, configurable from a streamer-facing dashboard. Every widget ships with four visually distinct themes — not recolors, but different shapes, type, effects, and layout language — so switching presets matches a channel's identity, not just its palette.
Widgets
Widget
Donation alert
An animated popup on every new donation, showing donor name, amount, and message, with sound support.
Widget
Recent donations
A scrolling carousel of the latest donors that auto-cycles with a smooth slide animation.
Widget
Top donors
An all-time or session leaderboard that gives the top supporter special treatment.
Theme system
Design
Soft Pink, Dark Mode, Neon Gaming, Minimal
Four presets built around real streamer archetypes — pastel glass for VTubers and IRL streams, violet glass for ambient/chill, cyan cyberpunk scanlines for competitive gaming, and a chrome-free left-accent style for podcasts and coding streams.
Engineering
CSS
Data-attribute theme architecture
Presets are scoped with `[data-preset="x"]` selectors on the widget root — no class toggling or per-element JS style injection — with a `clearCSSVars()` early return and targeted `!important` overrides to resolve a real specificity conflict against dashboard-applied inline CSS variables.
Infra
Live preview & CI/CD
The dashboard streams every setting to an embedded iframe via query params so changes preview live before saving. All three repos auto-deploy to Cloudflare Pages on push, after tracking down a silent build failure caused by an npm 10 vs. npm 11 lockfile mismatch.
Shipped
- ✓All three widgets deployed and live on Cloudflare Pages with auto-deploy from GitHub
- ✓4 presets implemented consistently across all 3 independent widget codebases
Ready to build something?
We take on a limited number of projects per quarter. Let's talk before the spots fill up.