- JavaScript 73.5%
- HTML 12.9%
- CSS 7.5%
- TypeScript 5.4%
- Python 0.2%
- Other 0.5%
| .devcontainer | ||
| .github | ||
| android | ||
| assets | ||
| extensions/js.neutralino.discordrpc | ||
| functions | ||
| images | ||
| ios | ||
| js | ||
| public | ||
| scripts | ||
| .dockerignore | ||
| .gitignore | ||
| .gitmodules | ||
| .htmlhintrc | ||
| .prettierrc | ||
| .stylelintrc.json | ||
| bun.lock | ||
| capacitor.config.ts | ||
| CONTRIBUTING.md | ||
| docker-compose.yml | ||
| DOCKER.md | ||
| Dockerfile | ||
| Dockerfile.dev | ||
| eslint.config.js | ||
| index.html | ||
| INSTANCES.md | ||
| legacy.html | ||
| license | ||
| neutralino.config.dev.json | ||
| neutralino.config.json | ||
| nginx.conf | ||
| package-lock.json | ||
| package.json | ||
| README.md | ||
| stream-stub.js | ||
| styles.css | ||
| test-search.js | ||
| THEME_GUIDE.md | ||
| tsconfig.json | ||
| vite-plugin-auth-gate.js | ||
| vite-plugin-blob.ts | ||
| vite-plugin-svg-use.ts | ||
| vite-plugin-upload.js | ||
| vite.config.ts | ||
Monochrome
An open-source, privacy-respecting, ad-free music app.
Website - Donate - Features - Usage - Self-Hosting - Contributing
What is Monochrome?
Monochrome is an open-source, privacy-respecting, ad-free TIDAL web UI, built on top of Hi-Fi. It provides a beautiful, minimalist interface for streaming high-quality music without the clutter of traditional streaming platforms.
Features
Audio Quality
- High-quality High-Res/lossless audio streaming
- Support for local music files
- API caching for improved performance
Interface
- Dark, minimalist interface optimized for focus
- Animated Album Covers For Supported Albums
- High-quality Music Videos
- Customizable themes & Community Theme Store
- Accurate and unique audio visualizer
- Offline-capable Progressive Web App (PWA)
- Media Session API integration for system controls
Library & Organization
- Recently Played tracking for easy history access
- Comprehensive Personal Library for favorites
- Queue management with shuffle and repeat modes
- Playlist import from other platforms
- Public playlists for social sharing
- Smart recommendations for new songs, albums & artists
- Infinite Recommendation Radio
- Explore Page (Hot & New) for discovering newly added music and whats trending overall or within each genre
Lyrics & Metadata
- Lyrics support with karaoke mode
- Genius integration for lyrics
- Track downloads with automatic metadata embedding
Integrations
- Account system for cross-device syncing
- Customizable & Public Profiles
- Last.fm and ListenBrainz integration for scrobbling
- Unreleased music from ArtistGrid
- Dynamic Discord Embeds
- Artist Biography + Social Links for learning more about your favorite artists
- Multiple API instance support with failover
Power User Features
- Keyboard shortcuts & Command Palette (CTRL+K) for power users
Quick Start
Live Instance
Our Recommended way to use monochrome is through our official instance:
monochrome.tf / monochrome.samidy.com
For alternative instances, check INSTANCES.md.
Self-Hosting
NOTE: Accounts will not work on self-hosted instances. Our Appwrite authentication system only allows authorized domains.
We had to heavily customize the authentication system and write several custom scripts to support features like SMTP and Google OAuth (which are currently bugged in Appwrite). Because of this, we can no longer provide a self-hostable accounts system.
Option 1: Docker (Recommended)
git clone https://github.com/monochrome-music/monochrome.git
cd monochrome
docker compose up -d
Visit http://localhost:3000
Tailscale Access
Visit http://<tailscale_server_hostname_or_ip>:3000
By default, the app uses Vite preview, which restricts access to localhost.
To allow access over Tailscale:
-
Open
vite.config.js -
Uncomment and configure the
previewsection:
preview: {
host: true,
allowedHosts: ['<your_tailscale_hostname>'], // e.g. pi5.tailf5f622.ts.net
},
- Restart with a fresh container (if already running):
docker compose down
docker compose up -d
For development mode and advanced setups, see DOCKER.md.
Option 2: Manual Installation
Prerequisites
Local Development
-
Clone the repository:
git clone https://github.com/monochrome-music/monochrome.git cd monochrome -
Install dependencies:
bun install # or npm install # NPM is included with Node.js -
Start the development server:
bun run dev # or npm run dev -
Open your browser: Navigate to
http://localhost:5173/
Building for Production
bun run build
# or
npm run build
Usage
Basic Usage
- Visit the Website or your local development server
- Search for your favorite artists, albums, or tracks
- Click play to start streaming
- Use the media controls to manage playback, queue, and volume
Keyboard Shortcuts
| Shortcut | Action |
|---|---|
Space |
Play / Pause |
→ |
Seek forward 10s |
← |
Seek backward 10s |
Shift + → |
Next track |
Shift + ← |
Previous track |
↑ |
Volume up |
↓ |
Volume down |
M |
Mute / Unmute |
S |
Toggle shuffle |
R |
Toggle repeat |
Q |
Open queue |
L |
Toggle lyrics |
/ |
Focus search |
Esc |
Close modals |
[ |
Previous visualizer preset |
] |
Next visualizer preset |
\ |
Toggle visualizer auto-cycle |
Ctrl + K |
Command Palette |
Account Features
To sync your library, history, and playlists across devices:
- Click the "Accounts" Section
- Sign in with Google or Email
- Your data will automatically sync across all devices
Contributing
We welcome contributions from the community! Please see our Contributing Guide for:
- Setting up your development environment
- Code style and linting
- Project structure
- Before You Contribute
- Commit message conventions
- Deployment information
Made with ❤️ by the Monochrome team