How to Build Chrome Extensions: The Indie Maker's Complete Guide (2026)
Learn how to build Chrome extensions from scratch in 2026. Covers Manifest V3, step-by-step code, publishing, monetization models, and how smart indie makers validate ideas before writing a single line of code.

Chrome controls roughly 65% of the global browser market (StatCounter, Jul 2025) — meaning nearly two-thirds of internet users are a single click away from your tool. Building a Chrome extension requires only HTML, CSS, and JavaScript. Publishing costs five dollars (Chrome Web Store Developer Dashboard). This guide shows you exactly how to build Chrome extensions from scratch, how to validate your idea before you write a single line of code, and how to turn your extension into a real revenue stream.
This isn't a "hello world" tutorial. It's the complete indie maker playbook: idea, validation, build, test, publish, monetize, and grow.
What Is a Chrome Extension — and Why Indie Makers Should Care
A Chrome extension is a small program built with HTML, CSS, and JavaScript that modifies or extends what Chrome can do. It can change how a webpage looks, automate repetitive tasks, add a sidebar, intercept requests, inject custom scripts, or surface entirely new UI on top of existing sites — all without touching the original website's code.
Every extension has four core parts:
- manifest.json — the configuration file that tells Chrome everything about your extension: its name, permissions, what files it uses, and what version of the platform it targets
- popup.html / popup.js — the small window that appears when a user clicks your extension icon in the toolbar
- content.js (content script) — JavaScript that runs inside the context of a webpage and can read or modify the page's DOM
- background.js (service worker) — event-driven background logic that runs only when triggered, not persistently
That's it. No native code, no app store review process that takes weeks, no Swift or Kotlin to learn.
Now consider the distribution opportunity. Chrome holds 63.7–67.9% of the global browser market as of mid-2025 (StatCounter). When you publish to the Chrome Web Store, you're placing your tool inside the browser used by the majority of the internet. There are currently around 111,933 active extensions in the Chrome Web Store — down from 137,345 in 2020 (AboutChromebooks Ecosystem Report, Aug 2025) — which means the field is actually getting less crowded at the top, not more. Productivity extensions account for 55.5% of all extensions, making them the dominant category, but every niche from finance to fitness to fashion has gaps worth filling.
The AI browser extension market alone was valued at approximately $1.5 billion in 2023 and is projected to reach $7.8 billion by 2031 (AboutChromebooks Ecosystem Report). This is a market that rewards specific, well-executed tools — not generic ones.
Should You Build from Scratch — or Start Smarter?
Most tutorials on how to build Chrome extensions skip the most important question: should you build this specific extension?
The single most common failure mode for indie extension developers isn't bad code. It's building something nobody wants. Thousands of extensions in the Chrome Web Store have zero or near-zero users because the developer guessed at a problem instead of confirming it existed first.
Here's a smarter starting point: study what has already worked.
Expired Chrome extensions are an overlooked goldmine for idea validation. When an extension gets abandoned — whether the developer burned out, moved on, or simply stopped updating it — the demand it served doesn't disappear. Users still search for it. The reviews still signal what problems people were willing to pay to solve. The Chrome Web Store search rankings may still carry residual weight. Learn more in our deep-dive on reviving expired extensions.
Before you write a single line of code, search Chrome Goldmine's database of 9,656+ expired extensions. Every entry includes revenue estimates starting from $100K+/year — meaning these aren't long-shot ideas, they're proven markets. You're not guessing at demand. You're inheriting it.
Chrome Goldmine is a database of 9,656+ expired Chrome extensions — each one with validated demand and a revenue estimate. It's the fastest way to skip the guesswork and build something people already want. Browse the database →
If you find an expired extension with 10,000+ users and $200K/year in estimated revenue, you now know three things: the problem is real, people will pay, and the space has no current winner. That's the clearest possible signal to build. Our reverse engineering guide walks you through exactly how to deconstruct what made top extensions successful.
Beyond Chrome Goldmine, use these validation methods in parallel:
- Review mining — Read the 1-star reviews on competitor extensions. That's your product roadmap. Users say exactly what's broken, missing, or frustrating.
- Reddit and IndieHackers — Search for "[problem] + Chrome extension" in relevant subreddits. If people are asking for it and the existing solution is bad, that's a gap.
- Google Trends and SEO tools — Confirm that search interest in the problem is stable or growing, not declining. Use SEO & marketing tools to validate keyword volume.
The rule is simple: don't build what you think people want. Build what they've already paid for. If you want a structured approach, our Deal Flow CRM in Notion guide shows you how to track and score opportunities systematically.
⚠ Manifest V3 — Read This Before Following Any Tutorial
Google requires all new Chrome extensions to use Manifest V3 as of 2024 (Google Chrome for Developers). If you follow an older tutorial — and many still rank highly in search — your extension will use outdated patterns and Google will reject your submission.
Red flags that a tutorial is out of date:
- Uses browser_action instead of action
- References background.persistent: true
- Talks about "background pages" without specifying they're service workers now
- Uses remote code execution (loading scripts from external URLs)
Every code example in this guide uses Manifest V3.
File Structure Overview
my-extension/
├── manifest.json ← the brain of your extension (required)
├── popup.html ← your toolbar UI (optional but common)
├── popup.js ← popup logic
├── background.js ← service worker (background logic)
├── content.js ← runs inside web pages
└── icons/
├── icon16.png
├── icon48.png
└── icon128.pngHow to Build Your First Chrome Extension (Step-by-Step, Manifest V3)
Let's build a real, working extension. Not a toy. This is a production-ready foundation you can extend into any idea. For a complete 48-hour sprint version of this process, see the Weekend Challenge.
Step 1 — Create Your Project Folder
Create a folder called my-extension anywhere on your computer. All your extension files will live here. The structure above is your starting point.
Step 2 — Write Your manifest.json
This file is the only required file in any extension. It tells Chrome everything it needs to know.
{
"manifest_version": 3,
"name": "Your Extension Name",
"version": "1.0.0",
"description": "What your extension does in one sentence.",
"action": {
"default_popup": "popup.html",
"default_icon": {
"16": "icons/icon16.png",
"48": "icons/icon48.png",
"128": "icons/icon128.png"
}
},
"permissions": ["activeTab", "storage"],
"background": {
"service_worker": "background.js"
}
}Key fields explained:
- manifest_version: 3 — required. This is not optional. Using 2 will get your submission rejected.
- action — defines the popup that appears when someone clicks your icon. This replaces the old browser_action key.
- permissions — only request what you actually need. activeTab lets you access the current tab when the user clicks your extension. storage lets you save data locally. Over-requesting permissions is the #1 rejection reason from the Chrome Web Store review team.
- background.service_worker — this is where Manifest V3 diverges from V2. Background logic now runs as a service worker, not a persistent background page.
Step 3 — Build Your Popup UI
Create popup.html — the small window that opens when a user clicks your icon:
<!DOCTYPE html>
<html>
<head>
<style>
body { width: 300px; padding: 16px; font-family: sans-serif; }
button { padding: 8px 16px; cursor: pointer; }
</style>
</head>
<body>
<h1>My Extension</h1>
<button id="action-btn">Do Something</button>
<script src="popup.js"></script>
</body>
</html>Now create popup.js to wire up the button:
document.getElementById('action-btn').addEventListener('click', async () => {
const [tab] = await chrome.tabs.query({
active: true, currentWindow: true
});
chrome.scripting.executeScript({
target: { tabId: tab.id },
func: () => {
document.body.style.backgroundColor = '#f0f4ff';
}
});
});When a user clicks the button, this changes the background color of the current tab. Simple, but it proves every part of the system works.
Note: To use chrome.scripting, add "scripting" to your permissions array in manifest.json.
Step 4 — Add a Content Script (Optional but Common)
A content script runs inside the webpage itself — not in the extension's isolated environment. It can read and modify the page's DOM directly. Declare it in manifest.json:
"content_scripts": [
{
"matches": ["https://*.example.com/*"],
"js": ["content.js"]
}
]The matches pattern controls which pages your script runs on. Use
Step 5 — Add a Background Service Worker (Optional)
The background service worker is event-driven. It wakes up when something happens — a tab update, an alarm, a message from a content script — does its work, and goes back to sleep. It has no persistent memory between wake-ups.
// background.js
chrome.runtime.onInstalled.addListener(() => {
console.log('Extension installed');
});
chrome.tabs.onUpdated.addListener((tabId, changeInfo, tab) => {
if (changeInfo.status === 'complete') {
// Tab finished loading — do something here
}
});This is the key behavioral change from Manifest V2. In V2, background pages ran continuously. In V3, they don't. If your extension needs to store state between events, use chrome.storage — not in-memory variables that will be wiped when the service worker sleeps.
Step 6 — Load Your Extension Locally (Developer Mode)
- Open Chrome and go to chrome://extensions
- Toggle Developer Mode on (top-right corner)
- Click "Load unpacked"
- Select your project folder
- Your extension icon appears in the toolbar
That's it. You're running a real Chrome extension locally. Every time you edit a file, click the refresh icon on your extension's card in chrome://extensions to reload it.
Step 7 — Debug Like a Pro
Knowing where to look when things break saves hours. Here's the map:
- Popup errors: Right-click your extension icon → Inspect. This opens DevTools for the popup.
- Service worker errors: Go to chrome://extensions, find your extension, click the "service worker" link. This opens DevTools for the background context.
- Content script logs: Open DevTools on any page where your content script runs. Your console.log statements appear there, not in the extension DevTools.
Common errors:
- Could not establish connection — content script wasn't injected (check matches pattern)
- Cannot read properties of undefined — likely a timing issue; the DOM isn't ready yet
- CSP violations — you tried to load external code or use eval(). Neither is allowed in Manifest V3.
Manifest V3 vs. V2 — What Changed and Why It Matters
If you've read any other guide on Chrome extension development, you've probably seen code that no longer works. Here's the before-and-after table:
| Feature | Manifest V2 (Deprecated) | Manifest V3 (Required) |
|---|---|---|
| Background logic | Persistent background page | Event-driven service worker |
| Toolbar button | browser_action / page_action | action (unified) |
| External code | Allowed via remote scripts | Forbidden — all JS must be bundled |
| Ad blocking | webRequest blocking | declarativeNetRequest |
| Persistent memory | In-memory variables (always alive) | chrome.storage (service workers can sleep) |
The most important change for indie makers: you cannot load JavaScript from external URLs. Everything your extension does must be bundled in the package you submit. This closes a major security hole and is strictly enforced. Any tutorial that shows you fetching a remote script at runtime is out of date and will result in rejection.
Google will reject Manifest V2 extensions submitted after the cutoff. The official migration guide is your reference if you're adapting an existing project.
How to Publish Your Chrome Extension to the Chrome Web Store
You've built something that works locally. Now let's ship it.
Pre-Submission Checklist
- Icons at 16×16, 48×48, and 128×128 pixels (PNG, required)
- A 440×280 promotional tile image (strongly recommended — it shows up in store listings)
- 1–5 screenshots at 1280×800 or 640×400
- A clear, keyword-rich description (honest — the review team reads it)
- A privacy policy URL if your extension touches any user data
- Your manifest.json at the root of your zip file (not inside a subfolder)
Publishing Steps
- Register your developer account at the Chrome Web Store Developer Dashboard — the one-time fee is five dollars.
- Zip your extension folder — compress the contents, not the folder itself. manifest.json must be at the root of the zip.
- Upload your zip in the developer dashboard and fill in your store listing.
- Submit for review — typical review time is 1–3 business days. Simple, clearly scoped extensions are often approved within 24 hours.
Common Rejection Reasons (Avoid These)
- Over-permissioning — requesting permissions you don't use. Only list what your extension actually needs. This is the #1 rejection trigger.
- No clear single purpose — Chrome Web Store policy requires every extension to fulfill one narrowly defined purpose. Multi-feature tools get flagged.
- Remote code execution — bundling or fetching external JavaScript at runtime. Forbidden under Manifest V3.
- Missing privacy policy — required if you collect, transmit, or store any user data, even temporarily. See our Chrome extension terms of service guide for what your policy and ToS actually need to say.
- Misleading description — claiming features you don't have or implying endorsements you don't have. The review team checks.
How Much Can You Actually Make with a Chrome Extension?
Let's talk numbers. Real ones. The case studies below are publicly verified through indie maker communities and developer disclosures (ExtensionPay Case Studies, 2024):
- GMass — a Gmail-integrated mass email tool, approximately $130,000/month MRR as of 2019. Subscription pricing at $8–$20/month. Built by a single developer.
- Closet Tools — a Poshmark automation extension for fashion resellers, approximately $42,000/month MRR. $30/month per user. Grew to a full-time income for the founder's family.
- Night Eye — an auto dark-mode extension, approximately $3,100/month MRR. Free + premium model.
- Rick Blyth's Merch Batch Editor — an Amazon Merch tool built in a single weekend, generated $3,000+ in sales at $12.99 one-time, acquired purely through organic Chrome Web Store traffic (rickblyth.com).
- Honey — the coupon-finding extension — was acquired by PayPal for $4 billion in 2020 (BuildingBrowserExtensions.com). That's the ceiling. You don't need to be Honey. Night Eye's $3,100/month changes a life for a solo founder.
"My first paid Chrome Extension took me around 4–5 hours to cobble together over one weekend. It was super basic, but it did everything it said it would — and critically, it fixed a painful problem for my user base." — Rick Blyth, Chrome extension developer who generated $500,000+ from his extension portfolio (LinkedIn)
Industry context: average successful Chrome extensions earn approximately $862,000/year, with monthly revenues averaging $72,800 and profit margins typically reaching 70–85%.
The honest counterweight: approximately 70% of Chrome extensions never exceed $1,000/month. The ones that break through solve a specific, recurring problem for a defined audience. Generic tools get lost. Niche tools get found. Our $1K/month side income blueprint shows you how to build a portfolio strategy that compounds.
The common thread in every successful extension above? They solved a proven problem. Chrome Goldmine surfaces those proven problems for you — filtered by revenue potential, niche, and category. Find your next validated idea →
ROI of Building a Chrome Extension: What the Numbers Actually Say
| Scenario | Time Investment | Monetary Investment | Expected Outcome |
|---|---|---|---|
| Simple free tool (build + publish) | 10–40 hours | $5 (CWS registration) | 0–500 users in 90 days |
| Freemium extension, solo dev | 40–120 hours | $5–$50 (dev tools/assets) | $0–$500/month MRR in year 1 |
| Validated idea (from expired extension data) | 40–100 hours | $5–$50 | $500–$5,000/month MRR possible by year 1 |
| Build to exit | 6–24 months | $200–$2,000 (design, marketing) | $100K–$500K exit value |
Assumptions: Time estimates based on a solo developer with basic JavaScript skills. Revenue ranges derived from case studies published on IndieHackers and ExtensionPay (2021–2025). "Validated idea" scenario assumes using existing demand signals (expired extensions, review mining) rather than building blind.
How to Monetize Your Chrome Extension (5 Models)
Getting your extension published is step one. Getting paid is step two. Here are the five models that actually work for indie makers.
1. Freemium — Free core features, paid premium tier. This is the most effective starting model for most extensions because it eliminates acquisition friction. Users install without committing money. They experience the value first, then upgrade. Night Eye runs this model. So do most productivity tools. Start here.
2. Subscription — Monthly or annual billing. Best for extensions that deliver ongoing value, like automation tools, AI features, or anything that touches a user's workflow daily. GMass and Closet Tools both run subscriptions. For implementation, use ExtensionPay (free, no backend required, Stripe-powered) or integrate Stripe directly. For full membership and billing management, Outseta is a solid all-in-one platform.
"I made ExtensionPay to use in my own extensions so it would be low-risk to try out extension ideas without spending a lot of time on monetizing." — ExtensionPay creator (IndieHackers)
3. One-time purchase — Lower friction, no recurring commitment. Best for standalone utility tools with clear, permanent value. Rick Blyth's Merch Batch Editor at $12.99 one-time is the canonical example: $3,000+ in sales from a single weekend build. One-time purchases convert better at launch but limit your lifetime value per user.
4. Affiliate / referral links — Embed natural recommendations inside your extension. A productivity extension that recommends tools earns a cut when users sign up. Works best when the recommendation is genuinely useful and contextual — users notice and resent forced affiliates quickly.
5. Acquisition — Build to exit. If you grow your extension to 10,000+ active users, it has real exit value. The micro-SaaS market is growing at approximately 30% annually, from $15.70 billion in 2024 toward a projected $59.60 billion by 2030 — and browser extension acquisitions are an active part of that market. Successful indie extensions sell at 40–60× monthly profit. Rick Blyth sold his extension portfolio on Empire Flippers within 5 hours of listing for the full asking price.
What Doesn't Work: Common Mistakes Indie Makers Make
This section exists because most guides won't tell you what to avoid. These are the five failure modes that account for the vast majority of Chrome extensions that never gain traction.
Mistake 1: Building without validation. This is the biggest one. Thousands of extensions have zero users because the developer skipped market research and assumed demand. Around 70% of Chrome extensions never exceed $1,000/month — and a large fraction of those generate almost nothing. The fix: use review mining, Reddit research, and Chrome Goldmine's expired extension database to confirm that the problem exists and people will pay before you build.
Mistake 2: Following outdated tutorials. Manifest V2 guides still dominate search results because they've accumulated years of backlinks. The code in them will not get your extension approved today. The warning signs: any tutorial that mentions background.persistent: true, uses browser_action instead of action, or loads JavaScript from a remote URL. Google's official Manifest V3 docs are the only ground truth.
Mistake 3: Requesting too many permissions. The Chrome Web Store review team rejects extensions for requesting permissions they don't use. Over-permission also kills installs — users see the permissions list during installation and get nervous if it asks for access to "all your data on all websites" when you're building a color-picker. Request only what you need.
Mistake 4: Skipping the freemium model. Paid-only extensions create massive friction at the install step. Users haven't experienced your value yet. They have no reason to trust you. A free tier lets users experience the product first, builds your user base faster, and creates upgrade opportunities. Launch free. Charge for the features power users need.
Mistake 5: No single clear purpose. Chrome Web Store policy requires extensions to fulfill a single, narrowly defined purpose. A "Swiss Army knife" extension that does tab management, screenshot capture, notes, and link saving will either get rejected outright or rank poorly because Chrome's algorithm can't categorize it. Pick one job, do it extremely well, expand later.
Is Building a Chrome Extension Worth It in 2026?
Short answer: yes — but only if you approach it like a business, not a coding exercise.
The Case for Yes
The barrier to entry is genuinely one of the lowest of any software business. A one-time $5 Chrome Web Store registration gives you access to a distribution channel that reaches billions of users. The skills required — HTML, CSS, and JavaScript — are the most common in software development. Profit margins when it works are 70–85%. You can build a working MVP in a weekend. And if you reach 10,000+ active users, you have an asset with real exit value.
There's also a timing window right now. The shift to Manifest V3 has forced many legacy extensions off the store — their developers either didn't update in time or chose not to. The market has openings that didn't exist two years ago.
The Honest Caveats
Chrome extension development is not passive income. Extensions break when websites update their DOM structure. Google policy changes can invalidate features overnight. Manifest V3 itself is still evolving — the declarativeNetRequest API is more limited than the webRequest blocking it replaced, and this matters if you're building anything in the ad-blocking or privacy space. Most extensions don't make meaningful revenue — the 70% who never break $1,000/month are a real data point, not a scare tactic.
The Smart Move
Use Chrome Goldmine's expired extension database to find validated ideas before you build. The extensions in that database already proved their market. Their users still exist. Their problems are still unsolved. You're not guessing — you're rebuilding with a roadmap.
You now have the full roadmap for how to build Chrome extensions — from your first manifest.json to your first paying user. The only thing standing between you and that is choosing the right idea. Don't build in the dark. Chrome Goldmine's database gives you the revenue data to build with confidence.
Recommended Tools & Resources for Chrome Extension Builders
Whether you're just getting started or scaling your extension, these are the tools and platforms that indie makers rely on. We've organized them by stage — check our full partner directory for exclusive discounts on many of these tools.
Development & Building
- VS Code — free, fast, excellent for JavaScript development
- Chrome Developer Mode — enable at chrome://extensions to load and test extensions locally
- Plasmo Framework — React and TypeScript extension development with hot-reload and streamlined builds
- WXT — TypeScript + Vite-powered extension development framework
- Chrome Extension Samples — Google's official repo of working examples for every major Chrome API
AI & Vibe Coding Platforms
Don't want to code from scratch? AI-powered building tools can generate working extension code from natural language prompts. For the complete playbook — best AI tools, prompt patterns, and a 6-step build process — read our vibe coding Chrome extensions guide:
- Lovable.dev — AI-powered app builder, great for generating extension UIs and full web apps
- Bolt.new — build full-stack prototypes through conversational prompts
- Replit — AI coding platform with instant hosting
- Cursor — AI-first code editor with deep integration for generating, editing, and debugging code
SaaS Starter Kits & Boilerplates
Skip weeks of setup with SaaS boilerplates that include auth, payments, and deployment out of the box:
- Launchfast — SaaS and Chrome extension starter kits
- TurboStarter — ship web apps, mobile apps, and browser extensions in 15 minutes
- Supastarter — scalable Next.js and Nuxt starter kit
- Shipped — Next.js SaaS boilerplate for fast launches
Payments & Monetization
- ExtensionPay — free, open-source library for in-extension payments with Stripe (no backend required)
- Outseta — all-in-one membership, billing, CRM, and authentication platform
- Browse more business tools for billing, analytics, and affiliate management
Marketing & Growth
- Mangools — affordable SEO suite for keyword research and competitor analysis
- Outrank.so — programmatic SEO on autopilot
- Browse SEO & marketing tools and social media marketing tools for growth
- MailerLite and Kit for email & newsletter tools to build your audience
Automation & Workflows
- n8n — AI workflow automation for technical teams
- Latenode — low-code workflow automation with AI agents
- Learn how to build an AI agent for idea discovery using these tools
Continue Learning: Deep-Dive Guides
- Chrome Extension Development Guide 2026 — The complete guide to building, launching, and monetizing a profitable MV3 extension
- Manifest V2 Replacement: The Complete Migration Guide — What replaces Manifest V2, how to migrate to MV3, what breaks, and how to turn the shift into an indie-maker opportunity
- From Zero to First Dollar: Weekend Challenge — A structured 48-hour sprint from picking an expired extension to earning your first dollar
- Build a Deal Flow CRM in Notion — Track, score, and evaluate Chrome extension opportunities systematically
- Build an AI Agent for Idea Discovery — Automate market scanning with n8n and OpenAI to surface profitable extension ideas
- $1K/Month Side Income Blueprint — A step-by-step portfolio strategy to reach $1,000/month
- Reverse Engineering Hyper-Profitable Extensions — Deconstruct what makes top extensions successful and apply those patterns
- Revive an Expired Extension in 7 Days — Turn an abandoned extension into a micro-SaaS with Manifest V3 and AI tools
- Chrome Extension Screen Capture API — How indie makers can ship screenshot and recording tools that monetize
- Content Scripts Tutorial — Master DOM manipulation, Shadow DOM, and UI injection for profitable extensions
- Chrome Extension Reading List Guide — Build an AI-powered reading list extension with the chrome.readingList API
- Error Handling in Chrome Extensions — Bulletproof error handling patterns for Manifest V3 service workers, content scripts, and API calls
- Service Workers in Chrome Extensions — Master the Manifest V3 service worker lifecycle, state persistence, and background event handling
- Message Passing in Chrome Extensions — Complete guide to chrome.runtime and chrome.tabs messaging between popup, background, and content scripts
- Chrome Storage API Guide — Master data persistence with local, sync, and session storage for robust extensions
- Chrome Extension DevTools Guide — Build, debug, and monetize custom developer tools with Manifest V3 and AI integration
- Chrome Extension Project Structure — Organize your extension code with WXT, React, and modular architecture patterns
- Browse All Partner Tools & Discounts — AI builders, SEO & marketing tools, SaaS boilerplates, and business tools for indie makers
Picking your research stack before you build? Our Chrome extension tool comparisons put the leading idea databases and validators side-by-side — including ProvenTools vs Chrome Goldmine for AI-ready build prompts and IdeaProof vs Chrome Goldmine for multi-model validation.

