How to make a Chrome extension — in an evening, even if you don't code

It feels like a browser extension is a serious program for pros. In reality it's a folder with a couple of text files that you load into Chrome yourself. No installer, no store, no approval — at the start you need none of that. One description file, one code file, and half an hour later your thing works on any site. Let's build the simplest extension together — a feature that highlights every link on a page. And yes, the AI writes almost all the code for you.
Step 1. Pick one tiny job
Don't overreach. A good first extension does exactly one visible thing: highlight all links, count words on a page, hide the recommendations feed on YouTube, pull out every image. We'll take "highlight all links in yellow" — the result is instant and the code is minimal.
What you get from this step: a clear goal in one sentence. That's half the work.
Step 2. Create a folder and the description file
Make a folder, say my-extension. Inside it, create a file called manifest.json — the extension's "passport": the browser reads it first. The format is plain JSON, that text in curly braces.
{
"manifest_version": 3,
"name": "Link Highlighter",
"version": "1.0",
"content_scripts": [
{
"matches": ["<all_urls>"],
"js": ["content.js"]
}
]
}
What matters here: manifest_version: 3 is the current format version (version two is no longer accepted). content_scripts says: "on all pages (<all_urls>), run my file content.js." That's all for now.
Step 3. Write the code that changes the page
Next to the manifest, create content.js. This code runs right on the open page and changes how it looks — it works with the DOM, the tree of a site's elements.
document.querySelectorAll("a").forEach((link) => {
link.style.backgroundColor = "yellow";
});
In plain words: "find every link (a) on the page and paint each one's background yellow." One line that does the job.
Don't want to write it yourself — you don't have to. Tell your AI editor: "write a content.js for a Chrome extension that highlights all links in yellow." It'll hand you exactly this. Your job is to understand what's in the file, not to type it letter by letter.
What you get: a folder with two files — manifest.json and content.js. That's a finished extension; all that's left is to plug it in.
Step 4. Load the folder into Chrome
Here's the nicest part — no store.
- Open the address
chrome://extensionsin your browser. - Turn on the Developer mode toggle in the top-right corner.
- Click Load unpacked and select your
my-extensionfolder.
Done. The extension shows up in the list and already works.
What you get: a card for your extension among the rest — like a real one, except you made it.
Step 5. Test and edit live
Open any site. The links are painted yellow — it works. Changed something in content.js (say, the color to lightgreen)? Go back to chrome://extensions and click the little reload circle on the extension's card, then refresh the page. Edit — reload — see. The loop takes seconds.
Didn't work? Don't panic — that's normal. Usually it's a typo in manifest.json (JSON is fussy about commas and quotes) or a wrong file name. Feed the error and both files to the AI — debugging it together is usually faster than guessing on your own.
What's next — from "for me" to a real one
When you want a button instead of auto-run, add an action and a popup.html with a button to the manifest. When you want to share it, there's the Chrome Web Store: a one-time developer fee and a short review, after which anyone can use your extension. But all that's for later. Today you already have a working thing you built in an evening.
Do I need to know how to program?
No, but understanding a little helps. The code itself is short, and the AI writes it. But reading the manifest, grasping "this runs on all pages," spotting a typo — that's your part. Without it you're helpless when something breaks. You don't need to code from scratch — you do need to understand the structure.
Which browsers will this work in?
An extension on manifest v3 is picked up by almost every Chromium-based browser: Chrome, Edge, Brave, Opera — the loading method is similar everywhere. Firefox uses a close but slightly different format, so the extension moves over with minor tweaks. Start with Chrome; the rest follows.
Short story-lessons, an agent simulator and daily practice — in our mobile app. Free.





