Undistracted+

A Chrome extension that blurs or hides distracting images and videos on social media to help you stay focused and productive.

Download Chrome Web Store

Screenshots

Facebook — Extension popup with blurred content

YouTube — All video thumbnails blurred

Settings — Toggle panel

Platforms

• Facebook
• YouTube
• Twitter / X
• LinkedIn
• Instagram

Installation

1. Open Chrome and navigate to chrome://extensions/
2. Enable Developer mode (toggle in top-right)
3. Click Load unpacked
4. Select the Undistracted+ folder
5. The extension icon appears in your toolbar

Usage

• Click the extension icon to open the popup
• Toggle the extension on/off globally
• Switch between Blur and Hide mode
• Mute or unmute videos
• Toggle individual sites on/off
• Browse social media — images and videos are blurred automatically

File Structure

Undistracted+/
├── manifest.json              # MV3 manifest
├── icons/                     # Extension icons
├── popup/
│   ├── popup.html             # Popup UI
│   ├── popup.css              # Popup styles
│   └── popup.js               # Popup logic
├── content/
│   ├── content.js             # Content script (blur/hide + video control)
│   └── content.css            # Blur & hide styles
├── background/
│   └── service-worker.js      # Background service worker
└── README.md

Tech Stack

• Chrome Extension Manifest V3
• Vanilla JavaScript (no frameworks)
• Chrome Storage API for persistence
• MutationObserver for dynamic content (infinite scroll support)