Configure a Component for the Utility Bar

To use a Lightning web component as a utility item in an app’s utility bar, define the component’s metadata.

The componentName.js-meta.xml file defines the metadata values for the component. To make your component usable as a utility item in the utility bar, set isExposed to true, and define a lightning__UtilityBar target. To expose editable properties in the App Manager, define the properties in targetConfigs.

See the complete list of XML Configuration File Elements.

To work with utility bars programmatically, use the Lightning Console JavaScript API.

To include an SVG resource as a custom icon for your utility item in the App Manager, add it to your component’s folder. It must be named componentName.svg. You can only have one SVG per folder.

See Also