A blazing-fast, feature-rich IPTV player built with Vanilla JS — no frameworks, no bloat.
Stream thousands of live TV channels with advanced filtering, live recording, and a stunning premium UI.
- HLS (M3U8) streaming via HLS.js with auto-recovery on errors
- MPEG-DASH (.mpd) streaming via Dash.js
- Native video support (MP4, MKV, WebM, Safari HLS)
- Low-latency mode enabled by default for live streams
- Picture-in-Picture (PIP) support
- Fullscreen toggle with keyboard shortcut (
F)
- Smart multi-criteria search — searches by channel name, country, language, and genre simultaneously
- Filter by Country 🌎, Language 🗣, and Category/Genre — dynamically populated from your M3U playlist
- Supports multi-value M3U attributes (
tvg-country,tvg-language) with semicolon-separated values per iptv-org standard - One-click filter reset button
- Channel tabs: All, Favorites ⭐, History 🕐
- Auto-generated logos from channel initials with unique gradient colors when no logo is available
- Displays country & language tags on each card
- Genre badges with color-coded tags (News, Sports, Kids, Entertainment, etc.)
- Inline meta tags cleaned of noise characters (
(),[], etc.)
- Record any live stream directly in the browser — no server required
- 8 Mbps high-quality recording (VP9 / H.264 depending on browser support)
- Output saved as
.mp4with smart filenames:ChannelName_YYYY-MM-DD_HH-MM.mp4 - Pause & Resume recording mid-stream — with animated Pause/Play toggle button
- Live REC timer overlay on the video with blinking red dot animation
- Timer shows
⏸symbol when paused - CORS/DRM-protected streams gracefully handled with a user-friendly alert
- TV Static (No Signal) animation when a stream fails — just like a real TV!
- Glitch effect on the broken TV icon
- Localized Uzbek error messages for each specific error type:
Error Message Server offline / 404 📡 Signal Topilmadi CORS / Geoblock 🔒 Kirish Taqiqlangan DRM protection 🛡 DRM Himoyasi Unsupported format 🎞 Format Xatosi No internet 🌐 Ulanish Xatosi - Retry button to reload the stream
- Glassmorphism design with animated gradient glows
- 3 built-in themes: Dark 🌑 | Light ☀️ | Glass 🔮
- All themes fully support icon and text visibility (no hardcoded colors)
- Responsive for mobile, tablet, and desktop
- Resizable sidebar via drag handle
- Smooth micro-animations throughout (hover, active, pop-in, glitch, pulsing)
- Fluid typography using CSS
clamp()for all screen sizes
- Virtual scrolling for channel lists — handles 10,000+ channels without lag
- Lightweight: zero build steps, zero npm dependencies at runtime
- Service Worker (PWA) for offline caching
- Local storage persistence for M3U URL, theme, favorites, and last-watched channel
This is a 100% client-side app. Just open index.html in your browser — no server needed.
git clone https://github.com/drowgone/IPTV-PRO.git
cd IPTV-PRO
# Open index.html in Chrome/Firefox/Edge# Using Python
python3 -m http.server 8080
# Using Node.js npx
npx serve .Then visit http://localhost:8080
- Click the ⚙️ Settings button (top-right of sidebar)
- Paste your M3U playlist URL
- Click Save
Test playlist:
https://iptv-org.github.io/iptv/index.m3u
iptv-pro-player/
├── index.html # Main HTML shell
├── style.css # Full design system (themes, animations, components)
├── app.js # Core app logic, filtering, rendering, virtual scroll
├── controls.js # Video player controls, recording, PIP, fullscreen
├── stream.js # HLS/DASH/Native stream handler with error categorization
├── parser.js # M3U playlist parser (multi-value country/language support)
├── storage.js # LocalStorage persistence layer
├── sw.js # Service Worker for PWA caching
├── manifest.json # PWA manifest
└── README.md
| Key | Action |
|---|---|
Space |
Play / Pause |
F |
Toggle Fullscreen |
M |
Toggle Mute |
↑ / ↓ |
Volume Up / Down |
This player follows the iptv-org M3U extended format:
#EXTM3U
#EXTINF:-1 tvg-id="AlJazeera.qa" tvg-name="Al Jazeera English" tvg-logo="https://..." tvg-country="QA;US;GB" tvg-language="English" group-title="News",Al Jazeera English
https://live-hls-web-aje.getaj.net/AJE/index.m3u8tvg-countryandtvg-languagesupport multiple values (semicolon-separated) for proper multi-language/multi-country channelsgroup-titleis used for genre/category filtering
| Browser | HLS | DASH | Recording | PIP |
|---|---|---|---|---|
| Chrome 90+ | ✅ | ✅ | ✅ | ✅ |
| Firefox 90+ | ✅ | ✅ | ✅ | ✅ |
| Edge 90+ | ✅ | ✅ | ✅ | ✅ |
| Safari 14+ | ✅ (native) | ✅ |
Note: Some streams may be blocked by CORS or DRM policies. This is a browser security limitation, not a player bug.
- CORS-protected streams cannot be played in the browser directly (requires a proxy or the stream server must allow cross-origin)
- DRM-protected content (Widevine, FairPlay) requires a licensed player environment
- Recording only works for streams that the browser can access — CORS-blocked streams cannot be captured
(Add your screenshots here)
Pull requests are welcome! For major changes, please open an issue first to discuss what you would like to change.
- Fork the repository
- Create your feature branch (
git checkout -b feature/amazing-feature) - Commit your changes (
git commit -m 'Add amazing feature') - Push to the branch (
git push origin feature/amazing-feature) - Open a Pull Request
This project is licensed under the MIT License — see the LICENSE file for details.