Skip to content

A lightweight browser extension that hides Instagram Reels, Explore, and other distracting features to create a distraction-free experience.

Notifications You must be signed in to change notification settings

echoxsync/Insta-Focus

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

2 Commits
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Instagram Focus Mode

A lightweight browser extension that removes distracting Instagram features and creates a distraction-free browsing experience. Hide Reels, Explore, Stories, and other time-wasting features to help you stay focused.

Features

Hide Reels Tab - Removes the Reels navigation button
Hide Reels in Inbox - Hides Reel messages sent in Direct Messages
Lightweight - Minimal performance impact
Auto-Update - Automatically detects and hides dynamically loaded content
Easy to Use - Works automatically, no configuration needed

Why Use This?

Instagram's algorithm is designed to maximize engagement through endless scrolling. Reels, Stories, and the Explore page are endless feeds engineered to keep you scrolling for hours. Instagram Focus Mode removes these distractions and lets you use Instagram on your own terms.

Before

  • Reels tab tempts you to endless video scrolling
  • Explore page shows random content
  • Stories at the top distract from messages
  • Reels sent in DMs interrupt conversations

After

  • Clean, focused navigation
  • Only Inbox and Notifications visible
  • No temptation to endless scroll
  • Distraction-free direct messaging

Installation

From GitHub (Manual)

  1. Clone or download this repository

    git clone https://github.com/echoxsync/instagram-focus-mode.git
  2. Open Chrome and go to chrome://extensions/

  3. Enable Developer mode (toggle in top right)

  4. Click Load unpacked and select the extension folder

  5. The extension is now active! Navigate to Instagram and start browsing distraction-free

From Chrome Web Store (Coming Soon)

Coming to the Chrome Web Store soon for one-click installation.

How It Works

This extension uses JavaScript content scripts to:

  1. Identify distracting elements on Instagram (Reels tabs, Explore buttons, etc.)
  2. Hide them using CSS display rules
  3. Monitor for changes as new content loads dynamically
  4. Re-apply hiding rules to ensure consistency across your session

The extension runs only on Instagram and has minimal performance impact.

Supported Browsers

  • ✅ Google Chrome / Chromium-based browsers (Edge, Brave, Vivaldi)
  • 🔄 Firefox (coming soon)
  • 🔄 Safari (coming soon)

What Gets Hidden?

  • 🎬 Reels Navigation Tab - The main Reels button in the sidebar
  • 🎥 Reels in Direct Messages - Reel videos sent in your inbox
  • 🔍 Explore Page (optional feature - can be toggled)
  • 📖 Stories (optional feature - can be toggled)
  • 🛍️ Shop Tab (optional feature - can be toggled)

File Structure

instagram-focus-mode/
├── manifest.json          # Extension metadata and configuration
├── content.js             # Main script that hides Instagram features
├── styles.css             # CSS rules for hiding elements
├── icons/
│   ├── icon16.png
│   ├── icon48.png
│   └── icon128.png
└── README.md              # This file

Usage

Once installed, the extension works automatically:

  1. Navigate to Instagram.com
  2. The extension automatically hides distracting features
  3. Browse freely without Reels, Explore, or other time-wasting features
  4. Enjoy a cleaner, more focused Instagram experience

Toggling the Extension On/Off

To turn the extension on or off:

  1. Click the extension icon in your Chrome toolbar
  2. Click the toggle button
  3. Refresh Instagram to see changes

Technical Details

  • Language: JavaScript, HTML, CSS
  • Manifest Version: 3 (latest Chrome extension standard)
  • Permissions Used:
    • storage - To save user preferences
  • Content Scripts: Runs on *.instagram.com/*

Troubleshooting

Extension not working?

  • Make sure Instagram is fully loaded before checking
  • Try refreshing the page (Ctrl+R or Cmd+R)
  • Disable and re-enable the extension in chrome://extensions/

Some elements still showing?

  • Instagram frequently updates its HTML structure
  • Please open an issue with a screenshot

Performance issues?

  • This extension is lightweight and should have minimal impact
  • If you experience slowness, try disabling other extensions

Contributing

Contributions are welcome! If you find bugs or want to add features:

  1. Fork the repository
  2. Create a new branch (git checkout -b feature/your-feature)
  3. Make your changes
  4. Test thoroughly on Instagram
  5. Submit a pull request

Areas for Improvement

  • Add popup UI for toggling features on/off
  • Support for Firefox and Safari
  • Whitelist certain accounts
  • Custom hide/show preferences
  • Dark mode support

Privacy & Security

✅ This extension:

  • Does NOT track your data
  • Does NOT collect personal information
  • Does NOT modify your Instagram account
  • Works entirely locally in your browser
  • Open source - inspect the code yourself

License

MIT License - see LICENSE file for details

Disclaimer

This extension is not affiliated with or endorsed by Instagram/Meta. Use at your own discretion. Instagram's terms of service should be reviewed before use.

Support

  • Found a bug? Open an issue on GitHub
  • Have a suggestion? Create a discussion or pull request
  • Need help? Check the troubleshooting section or open an issue

Made with ❤️ to help you focus

Show Your Support

If this extension helps you stay focused and productive, please:

  • ⭐ Star the repository
  • 📢 Share it with friends
  • 🐛 Report bugs to help improve it

About

A lightweight browser extension that hides Instagram Reels, Explore, and other distracting features to create a distraction-free experience.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published