Base64 Decoder — Chrome Extension

Instantly decode Base64-encoded text from any webpage using the right-click context menu.

Features

• 🖱️ Right-click context menu — select any text, right-click, and choose "Decode Base64"
• 🔓 Instant decoding — displays the decoded result in a sleek modal overlay
• 🔗 URL detection — if the decoded text is a valid URL, a clickable link opens it in a new tab
• 📋 One-click copy — copy the decoded result to the clipboard instantly
• ⌨️ Keyboard-friendly — press Escape or click outside to dismiss the modal
• 🎨 Premium dark UI — glassmorphism modal with smooth animations

Tech Stack

Tool	Role
TypeScript	Type-safe source code
Vite	Fast bundler
@crxjs/vite-plugin	Chrome extension build pipeline
Bun	Package manager & runtime

Manifest V3

Built on Chrome Manifest V3 with:

• contextMenus — adds the right-click menu item
• activeTab + scripting — injects the modal into the active tab via chrome.scripting.executeScript

Project Structure

base64decode/
├── src/
│   ├── manifest.json               # Extension manifest (MV3)
│   └── background/
│       └── service-worker.ts       # Context menu + modal injection logic
├── public/
│   └── icons/
│       ├── icon16.png
│       ├── icon32.png
│       ├── icon48.png
│       └── icon128.png
├── dist/                           # Built extension (load this in Chrome)
├── vite.config.ts
├── tsconfig.json
└── package.json

Getting Started

Prerequisites

• Bun >= 1.0
• Google Chrome (or any Chromium-based browser)

Install dependencies

bun install

Development (watch mode)

bun run dev

Rebuilds automatically on file changes. Reload the extension in Chrome after each build.

Production build

bun run build

Output is placed in the dist/ folder.

Loading in Chrome

1. Open chrome://extensions/
2. Enable Developer mode (top-right toggle)
3. Click Load unpacked → select the dist/ folder
4. The extension icon appears in the toolbar

Usage

1. Select any Base64-encoded text on a webpage
2. Right-click → Decode Base64
3. A modal appears with the decoded content
4. Click Copy to copy the result, or click the link if a URL was detected

Test values

Base64	Decoded
SGVsbG8gV29ybGQ=	Hello World
aHR0cHM6Ly9nb29nbGUuY29t	https://google.com (opens as link)
Zm9vYmFy	foobar

Icon sizes

Chrome extensions support the following icon sizes (all provided):

Size	Usage
16×16	Toolbar favicon
32×32	Windows display (avoids downscaling from 48px)
48×48	chrome://extensions management page
128×128	Installation dialog & Chrome Web Store

License

MIT