Google Chrome Extension Numbers on the Icon

First you will have to do a few things. You need to have a background page on where you have to put the code for showing the BadgeText. And second you will have to register your background script file in the manifest.json file.

You have to make a background.js file or any other *.js file. Then in the background.js file You have to write this code.

chrome.browserAction.setBadgeBackgroundColor({ color: [255, 0, 0, 255] });
chrome.browserAction.setBadgeText({text: 'your text'});

After that save it to the same folder as of your extension. Then edit your manifest.json file and enter this code at the end

,
"background":
{
  "scripts":["background.js"]
}

Now when you reload the extension you will see the word your as badge text because only four characters will be displayed in that small area. However it is not a hard and fast rule that the text string will be truncated to four characters, it's just that as many characters can fit in it will be displayed. I needed five characters and I got lucky that two of them were i and they do not take much space and all of the five characters got displayed. If you wanna try I was trying to display Nidhi.

You can set a badge on your browser action with setBadgeText:

chrome.browserAction.setBadgeText({text: "10+"}); // We have 10+ unread items.

Note that if the text you pass is longer than 4 characters, it will be truncated to the first 4 characters.

Edit: Mar 2021

According to the new Manifest V3, the APIs have been changed. According to the document:
In Manifest V3 the chrome.browserAction and chrome.pageAction APIs are consolidated into a single chrome.action API.

So, your code for adhering to the new API shall be:

chrome.action.setBadgeText({text: "10+"}); // We have 10+ unread items.