Track your YouTube data consumption in real time — right inside the player.
YouTube Data Usage Detector is a privacy-first Chrome Extension that estimates and tracks your internet data consumption for every YouTube video you watch — all in real time, directly inside the player.
Whether you're on a metered mobile hotspot or managing a strict monthly ISP quota, this extension gives you a clear, live picture of how much data your YouTube sessions are actually consuming.
🔒 100% client-side. No remote servers, no telemetry, no cloud databases. Every byte of your data stays on your device.
Reads video.videoHeight directly from the HTML5 DOM — even when YouTube's player is set to Auto quality — and maps it instantly to a matching bitrate tier (144p → 4K).
Playing at 2×? Your data consumption is scaled accordingly. The tracker always reflects your true buffer-decoding rate at any speed.
A beautiful floating widget renders directly inside the YouTube player with:
- Drag-and-drop repositioning — place it anywhere in the video area.
- Persistent position memory — your layout preference is saved across videos.
- Minimizable bubble mode — collapse to a tiny pulsing icon when you don't need it.
- Set a custom monthly GB data cap.
- Set a custom billing cycle reset day.
- Glowing red border and warning badges appear if a video's total data exceeds your remaining quota.
Detects timeline jumps (seeks) and automatically adds a 2.5-second bitrate overhead to account for YouTube's real-world re-buffering requests.
Override the default bitrates for any quality tier (144p through 4K) from the extension's popup settings dashboard.
A polished dashboard inside the extension popup displays:
- Live circular progress gauge for your remaining monthly quota.
- Per-session and cumulative monthly usage statistics.
- Editable bitrate and quota settings.
YouTube uses adaptive DASH streaming. The extension uses these realistic stable-stream averages:
| Quality | Bitrate |
|---|---|
| 144p | 100 kbps |
| 240p | 300 kbps |
| 360p | 700 kbps |
| 480p | 1,000 kbps (1 Mbps) |
| 720p | 2,500 kbps (2.5 Mbps) |
| 1080p | 5,000 kbps (5 Mbps) |
| 1440p | 8,000 kbps (8 Mbps) |
| 4K | 20,000 kbps (20 Mbps) |
To convert a bitrate
Example — 1080p video at 5,000 kbps:
| Duration | Estimated Usage |
|---|---|
| 1 minute | ~35.76 MB |
| 1 hour | ~2,145.8 MB (~2.1 GB) |
yt-kuota-detector/
├── manifest.json # Extension metadata — Manifest V3
├── background.js # Service worker: defaults management & monthly quota resets
├── content.js # DOM observer, telemetry tracking & overlay UI injection
├── content.css # Glassmorphic overlay widget styles
├── popup.html # Slate-dark popup dashboard markup
├── popup.js # Popup widget logic & chrome.storage interfaces
├── styles.css # Popup interface styling
└── README.md # This file
Requirements: Google Chrome 88+ with Manifest V3 support.
1. Download the source
git clone https://github.com/your-username/yt-kuota-detector.git
cd yt-kuota-detectorOr download and extract the latest release ZIP.
2. Open the Chrome Extensions page
Navigate to chrome://extensions/ in your browser.
3. Enable Developer Mode
Toggle Developer mode on (top-right corner of the Extensions page).
4. Load the unpacked extension
Click Load unpacked, then select the yt-kuota-detector/ folder.
5. Pin the extension
Click the puzzle icon 🧩 in the Chrome toolbar and pin YouTube Data Usage Detector for quick access.
6. Try it out
Open any YouTube video (e.g., https://www.youtube.com/watch?v=dQw4w9WgXcQ). The glassmorphic overlay will appear in the bottom-right corner of the player immediately.
| Permission | Purpose |
|---|---|
storage |
Saves custom settings, monthly usage logs, and widget position offsets using chrome.storage.local |
*://*.youtube.com/* |
Required to inspect HTML5 <video> elements and inject the floating overlay widget |
No external APIs, analytics endpoints, or remote servers are contacted — ever.
Contributions, bug reports, and feature requests are welcome!
- Fork this repository.
- Create a feature branch:
git checkout -b feat/your-feature-name - Commit your changes:
git commit -m 'feat: add your feature' - Push to the branch:
git push origin feat/your-feature-name - Open a Pull Request.
Please open an issue first for major changes so we can discuss the approach before you invest time building it.
Distributed under the MIT License. See LICENSE for full details.
Made with ❤️ for data-conscious YouTube watchers.
⭐ Star this repo if you find it useful!