Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Set icon or logo for extension in vscode

Tags:

I've created an extension for vscode (not yet published, only installed localy), how can I set an icon to be seen in the section of the extensions in vscode?

like image 780
asv Avatar asked Mar 18 '17 16:03

asv


People also ask

How do I configure extensions in VS Code?

You can browse and install extensions from within VS Code. Bring up the Extensions view by clicking on the Extensions icon in the Activity Bar on the side of VS Code or the View: Extensions command (Ctrl+Shift+X). This will show you a list of the most popular VS Code extensions on the VS Code Marketplace.


1 Answers

You can set the icon in the extension's package.json file, which is also called "extension manifest".

The field in which you set the path to an icon is called "icon". The icon file itself has to be 128x128 pixels. As noted by Philipp Kief in the comments, you should use a PNG file, not an SVG.

Example:

{     "name": "extension-name",     "displayName": "Extension Name",     "description": "...",     "icon": "images/spellIcon.png",     "version": "0.0.1",       ... 

More on VS Code's official page.

like image 169
Fabian Lauer Avatar answered Oct 11 '22 15:10

Fabian Lauer