About Sonogram
Transforming sound into sight — every track becomes a unique generative artwork.
What is Sonogram?
Sonogram is a generative audio-art platform that turns any piece of music into a one-of-a-kind visual artwork. Upload a track — or go live with your microphone — and watch as audio features like tempo, frequency spectrum, and beat patterns drive neon visualizations, fluid simulations, and particle systems in real time.
Every song has a unique mathematical fingerprint; Sonogram makes it visible.
How it works
- Studio — Upload audio and generate a shareable sonogram artwork with extracted features like BPM, key, and spectral shape.
- Gallery — Browse and discover artworks created by the community, and launch immersive experiences.
- Turntable — A neon-glowing vinyl turntable that spins and pulses in response to your music.
- Mustang Neon — A neon-outlined Mustang where different car parts light up and respond to distinct frequency bands.
- Landscape — World cities at night rendered in tilted 3D, with bokeh lights and traffic flowing in sync with your music.
Credits
Core technologies
- FastAPI (opens in new tab) — Backend framework
- Three.js (opens in new tab) — 3D rendering engine
- Vite (opens in new tab) — Frontend build tooling
- SQLAlchemy (opens in new tab) — Database ORM
Audio analysis
- Librosa (opens in new tab) — Audio feature extraction
- Web Audio API (opens in new tab) — Real-time FFT & beat detection
- SoundFile (opens in new tab) — Audio file I/O
- Mutagen (opens in new tab) — Audio metadata parsing
Graphics & shaders
- Ashima Arts (opens in new tab) — Simplex noise (GLSL)
- Domenico Brizi (opens in new tab) — Volumetric cloud raymarching
- vite-plugin-glsl (opens in new tab) — GLSL shader imports
Maps & geospatial
- MapLibre GL (opens in new tab) — Vector map rendering
- deck.gl (opens in new tab) — WebGL2 layered data visualisation
- OpenStreetMap (opens in new tab) — Road & building geometry
Image processing
- Pillow (opens in new tab) — Image generation & manipulation
Design
- Cormorant Garamond (opens in new tab) — Display typeface
- Inter (opens in new tab) — Body typeface
- Japanese aesthetic design system — washi paper, lacquer red, indigo ink
Contact
Questions, feedback, or a takedown request? Get in touch at sonogram@ars.md.