MPL-2.0 Open Source macOS / Windows / Linux Electron 43 Free

opabrow Transparent Overlay Browser

A workplace browsing tool — a desktop overlay browser with adjustable opacity, always-on-top, and click-through. Browse the web anytime while working, and go transparent in one click when the boss comes.

Core Features

Transparent

Window Opacity Adjustment

Adjust window opacity freely from 10% to 100%, balancing work and browsing. Supports quick keyboard shortcuts.

On Top

Always-on-Top + Click-Through

The window always floats on the top layer. With click-through enabled, the mouse can directly operate the window below without interference.

Right-Click

Full Right-Click Menu

Selected text can be copied or searched on Google/Bing; links can be copied or opened; supports paste, select all, and more.

Bilibili

Bilibili Video Webpage Fullscreen

Auto-detects Bilibili video pages and enters webpage fullscreen in one click, no manual clicking needed. Can be disabled in the menu.

Update

Auto Update Detection

Supports GitLab / GitHub automatic new version detection. Checks on startup and notifies instantly when updates are available.

Bookmarks

Bookmarks / History / Password Manager

Supports Chrome / Safari bookmark import, local history, and Chrome password CSV import with auto-fill.

Drag

Resizable Address Bar

Address bar width can be freely dragged and adjusted (minimum 100px) to fit different use cases.

Mobile

Mobile Mode Access

Switch to a mobile User-Agent in one click to browse pages in mobile layout, saving screen space.

Download & Install

Free and open source, cross-platform. Choose the version for your system:

FAQ

What is opabrow?

opabrow is an Electron-based transparent overlay browser designed for users who need to browse the web while working. The window can adjust opacity, stay always-on-top, and enable click-through, making it perfect for workplace browsing scenarios.

Which operating systems are supported?

Supports macOS (Apple Silicon + Intel), Windows x64, and Linux x64. All platforms share the same features and a similar experience.

Is it free?

Completely free, released under the MPL-2.0 open source license, with source code hosted on GitHub.

What if the tray icon doesn't show on Windows?

Version 1.0.0 has fixed the Windows tray icon display issue. Make sure you're using the latest version. If the problem persists, please submit an issue on GitHub.

How do I disable Bilibili video auto webpage fullscreen?

Uncheck View > Bilibili Video Default Webpage Fullscreen in the menu bar. The setting is saved automatically and takes effect on next launch.

How do I configure auto update detection?

The app reads the update-source.json config file in the userData directory. You can configure GitLab or GitHub as the update source. It checks automatically on startup, or you can trigger it manually via View > Check for Updates...

Use Cases

💻

Working & Browsing

Adjust window opacity to 30% and pin it above your work windows. Lower the opacity in one click when the boss approaches — work and browsing without conflict.

📺

Video While Working

Enable click-through so the video window floats on top without blocking mouse input. Type in your editor while watching a video at the same time.

📱

Mobile Web Testing

Switch to a mobile User-Agent in one click to preview pages in mobile layout. A handy tool for frontend developers debugging responsive layouts.

🔍

Quick Reference

Select text and right-click to search on Google without switching windows. The address bar width is drag-adjustable to fit different pages.

🎵

Bilibili Background Play

Bilibili videos auto-enter webpage fullscreen; combined with opacity and click-through, you can listen to podcasts while working without taking up screen space.

📖

Reading Documentation

Pin documentation pages as an overlay and reference them while writing code, without switching back and forth between windows.

Quick Start

Download & Install

Download the installer for your platform from GitHub Releases. Drag into Applications on macOS, run the NSIS installer on Windows, or use the AppImage on Linux.

Adjust Transparency

After opening the app, adjust window opacity via the tray menu or keyboard shortcuts. 10% is nearly invisible, 100% is fully opaque.

Enable Always-on-top & Click-through

Check "Always on Top" and "Click Through" in the tray menu. Always-on-top keeps the window on the top layer; click-through lets the mouse operate the window underneath.

Import Bookmarks & Passwords

Import bookmarks from Chrome / Safari, and import passwords by exporting a CSV file from Chrome. Select the corresponding options in the tray menu.

Configure Auto-update (Optional)

Configure a GitLab or GitHub update source in userData/update-source.json. The app checks for new versions automatically on startup.

Tech Stack

Electron 43 Cross-platform desktop framework React 19 UI rendering layer TypeScript Type safety electron-vite Build tool WebContentsView Web content rendering Node.js HTTPS Auto-update detection SemVer Version comparison electron-builder Packaging & publishing

Changelog

v1.0.0
  • Auto-update detection: supports GitLab / GitHub Releases API
  • Windows compatibility: fixed tray icon display, added opacity adjustment popup
  • Right-click context menu: copy, search, paste, open links, and more
  • Resizable address bar: freely adjustable with a 100px minimum
  • Bilibili video webpage fullscreen can be disabled: toggle in one click from the menu
  • SEO landing page: trilingual support (Chinese/English/Japanese), structured data
v0.3.x
  • Bookmark management: Chrome / Safari bookmark import
  • Password management: Chrome password CSV import and auto-fill
  • History: local browsing history management
  • Mobile mode: User-Agent switching
  • Multi-tab: tab management
v0.1.x - v0.2.x
  • Transparent window: 10%-100% opacity adjustment
  • Always-on-top: window stays on the top layer
  • Click-through: mouse can operate the window underneath
  • Title bar hover detection: auto show/hide the title bar