I Built a Productivity "Command Center" for Chrome with React 19 & Glassmorphism 🚀

The Problem: "New Tab" Chaos 🤯

We open new tabs hundreds of times a day. Usually, it's just a blank page or a cluttered default screen filled with distracting news feeds.
As a developer, I wanted my "New Tab" to be a sanctuary of focus—a place that helps me get back into the zone, not pull me out of it.
So, I built Work Dashboard. It's a premium, productivity-focused replacement for the Chrome New Tab page, designed with a sleek Glassmorphism aesthetic.

✨ The Features

Here is what makes it different from the hundreds of other dashboard extensions out there:

1. The "Flow State" Media Controller 🎧

I hate hunting through 50 open tabs just to pause Spotify or skip a YouTube ad.
Work Dashboard integrates a universal media controller right on the home screen. It connects to your active media tabs so you can control playback without leaving your current context.

2. Glassmorphism Design System 🎨

I didn't want another flat, boring tool. I used Vanilla CSS Variables to build a dynamic, frosted-glass UI that adapts to your wallpaper.

• Themes: Includes "Deep Dark" for coding late at night and "Nature" for a calming vibe.
• Customization: Drag-and-drop widgets to build your perfect layout. ### 3. Developer-First Widgets 🛠
• Live Status: See your unread Gmail count directly on the dashboard icon.
• Quick Notes: A scratchpad for those "don't forget this" thoughts.
• App Library: Quick access to the tools we actually use: GitHub, Figma, Vercel, Notion, and Linear. ## 🏗 Under the Hood (Tech Stack) Building a Chrome Extension in 2026 requires a modern toolchain. Here is what I chose:
• React 19: Leveraging the latest concurrent features for a snappy UI.
• Vite: For an instant dev server and optimized distinct builds.
• @dnd-kit: The best library standard for accessible drag-and-drop interfaces in React.
• Chrome Extension APIs: Heavily utilizing chrome.tabs (for media control), chrome.topSites, and chrome.storage.sync to keep settings persistent across devices. ## 🚀 What's Next? I am currently finalizing the first public release for the Chrome Web Store. The goal is to keep it lightweight, privacy-focused, and incredibly fast. I'd love your feedback:
• What is the one feature your current New Tab page is missing?
• Do you prefer a minimal clock/greeting or a data-rich dashboard? Drop a comment below! 👇 #react #webdev #showcase #productivity Get it on Chrome Web Store