1 Repo
Real-time modification of CSS properties based on external data streams.
Distinct from CSS Property Detectors: Candidates focus on minification, validation, or detection, not the dynamic updating of properties based on audio amplitude.
Explore 1 awesome GitHub repository matching user interface & experience · Dynamic CSS Property Modulation. Refine with filters or upvote what's useful.
Rythm.js ist ein JavaScript-Animationsframework, das darauf ausgelegt ist, visuelle Schnittstellenelemente mit der Audiowiedergabe oder einem Live-Mikrofoneingang zu synchronisieren. Es fungiert als DOM-Manipulations-Tool, das Echtzeit-Audiofrequenzdaten auf CSS-Eigenschaften abbildet, wodurch Webelemente als Reaktion auf Klang pulsieren, sich bewegen und transformieren können. Die Bibliothek zeichnet sich durch eine granulare Frequenzband-Zuordnung aus, die es Entwicklern ermöglicht, spezifische Bereiche wie Bässe, Mitten oder Höhen zu isolieren, um gezielte visuelle Reaktionen auszulösen. Durch die Integration mit der Web Audio API verarbeitet sie Audiosignale, um dynamische Geometrieänderungen anzutreiben, wie etwa Verschiebungen in der Elementposition, Rotation und stilistische Attribute wie Farbe oder Deckkraft. Die Core-Engine nutzt eine hochperformante Render-Schleife, um sicherzustellen, dass visuelle Updates mit dem Audio-Takt und den Bildwiederholraten des Displays synchron bleiben. Sie unterstützt sowohl das Hooking externer Medienelemente als auch die Verarbeitung von Live-Mikrofon-Streams, was eine breite Palette reaktiver Designanwendungen ermöglicht.
Translates audio amplitude values into CSS units to alter element geometry, color, and position in real time.