Custom node icons

By default, all your custom types will use the Node icon in the editor UI -- e.g. in the scene tree or when selecting a node to create. While this can be serviceable, you may want to add custom icons to distinguish node types, especially if you plan to distribute your extension to others.

All icons must be registered by their class name in your .gdextension file. For this, you can add a new icon section. Classes are keys and paths to SVG files are values.

[icons]

MyClass = "res://addons/your_extension/filename.svg"

Icon paths

The path is based off the res:// scheme, like other Godot resources. It is recommended to use Godot's convention of an addons folder, followed by the name of the addon.

Read more about the reasoning behind this in the Godot docs:

Formatting for custom icons

The Godot docs have a page dedicated to tools and resources for creating custom icons. The long and short of it is:

  • Use the SVG format.
  • Aspect ratio is a square, 16x16 units is the reference size.
  • Refer to the Godot icon colors mappings.
    • Use the light mode colors -- Godot only supports light-to-dark, but not dark-to-light color conversions.

Third-party article

The user QueenOfSquiggles wrote an alternative version of this article on her personal blog, which includes color previews for the light and dark themed colors.

Details on how to use her reference page is included here.