CODEWITHSUNDEEP
jsongoogle-chromegoogle-chrome-extensionbrowser-extension
Saint Robson
Saint Robson

Reputation: 5525

Chrome Extension Icon Manifest

How to change Chrome Extension icon in this page?

extension description

Here's my manifest code :

{
  "manifest_version": 2,
  "name": "Demo",
  "description": "This is demo.",
  "version": "1.0",
  "browser_action": {
    "default_icon": "icon128.png",
    "icons": {
       "16": "icon16.png",
       "48": "icon48.png",
      "128": "icon128.png"
    },
    "default_popup": "popup.html"
  },
  "permissions": [
    "activeTab",
    "storage"
  ]
}

The icon on toolbar is changed, but not on the chrome://extension page.

Upvotes: 17

Views: 24824

Answers (3)

Smart Manoj
Smart Manoj

Reputation: 5824

For me, I created icons from a webp image from this generator. The icon 48x48 should be displayed on the toolbar and the extension page. The generated image size is 1kb. It worked when I regenerated it from a 'PNG' file. (size 3kb)

Upvotes: 0

Nickson Yap
Nickson Yap

Reputation: 1276

It should be:

{
  "manifest_version": 2,
  "name": "Demo",
  "description": "This is demo.",
  "version": "1.0",
  "icons": {
    "16": "icon16.png",
    "48": "icon48.png",
    "128": "icon128.png"
  },
  "browser_action": {
    "default_popup": "popup.html"
  },
  "permissions": ["activeTab", "storage"]
}

See: Chrome Extension Manifest Docs

Upvotes: 12

Teepeemm
Teepeemm

Reputation: 4508

Set "icons" key in manifest.json.

The browser_action.icons key is what gets displayed in the toolbar (and will probably only use 16, 24, and 32 sized images, see browserAction).

The one displayed in chrome://extensions is a top level icons key. In the manifest documentation, look for the 6th entry, so that your manifest has an top-level entry, like:

{
  "icons": {
    "16": "icon16.png",
    "48": "icon48.png",
    "128": "icon128.png"
  }
}

Upvotes: 28

Related Questions