546c80e4aeb1d7d24f8a5b6856c27925ae581c3d
Changed level meter display to show professional dB values instead of percentages, and replaced volume icon with gauge icon. Display Changes: - Show dB values (-60 to 0) instead of percentage (0-100%) - Use monospace font for consistent digit alignment - Show "-∞" for silence (level = 0) instead of "-60" - Rounded to nearest integer dB (no decimals for cleaner display) Icon Updates: - Replaced Volume2 icon with Gauge icon for playback levels - Kept Mic icon for recording input levels - Gauge better represents metering/measurement vs audio control dB Conversion: - Formula: dB = (normalized * 60) - 60 - Reverse of: normalized = (dB + 60) / 60 - Range: -60dB (silence) to 0dB (full scale) Display Examples: 0.00 (0%) = -∞ (silence) 0.17 (17%) = -50dB (very quiet) 0.50 (50%) = -30dB (moderate) 0.83 (83%) = -10dB (loud) 1.00 (100%) = 0dB (full scale) Benefits: ✅ Professional dB notation matching industry standards ✅ Clearer for audio engineers and musicians ✅ Easier to identify levels relative to 0dBFS ✅ Gauge icon better conveys "measurement" ✅ Monospace font prevents number jumping Now meters show "-18" instead of "70%" making it immediately clear where you are in the dynamic range. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
Audio UI
A sophisticated browser-only audio editor built with Next.js 16, React 19, and Tailwind CSS 4.
Features (Planned)
- 100% Client-Side: All audio processing happens in your browser
- Multi-Track Editing: Professional multi-track audio editing
- Advanced Effects: EQ, compression, reverb, delay, and more
- Automation: Automate volume, pan, and effect parameters
- Recording: Record audio directly from your microphone
- Analysis Tools: Frequency analyzer, spectrogram, and loudness metering
- Export Formats: WAV, MP3, OGG, FLAC
- Project Management: Save and load complete projects
- Privacy-First: No uploads, all data stays local in your browser
Tech Stack
- Next.js 16 with React 19
- TypeScript 5
- Tailwind CSS 4 with OKLCH colors
- Web Audio API for audio processing
- Canvas API for waveform visualization
- IndexedDB for project storage
Getting Started
This project is currently in the planning phase. See PLAN.md for the complete implementation plan.
Development (Coming Soon)
# Install dependencies
pnpm install
# Run development server
pnpm dev
# Build for production
pnpm build
Inspiration
Inspired by AudioMass and professional DAWs like Ableton Live, Logic Pro, and FL Studio.
License
TBD
Contributing
This is a personal project, but suggestions and ideas are welcome!
Description
Languages
TypeScript
98.8%
CSS
1.1%
Dockerfile
0.1%