SVGIcons

Spicetify.SVGIcons maps each SVGIcon name to the inner markup of a 16 by 16 <svg>. In a module, use client.icons.

const SVGIcons: Record<SVGIcon, string>;

Wrapper classes such as Topbar.Button, Playbar.Button and ContextMenu.Item accept the name and build the <svg> for you. Anywhere else, wrap the markup yourself.

const icon = `<svg width="16" height="16" viewBox="0 0 16 16" fill="currentColor">${Spicetify.SVGIcons.play}</svg>`;

<svg width={16} height={16} viewBox="0 0 16 16" fill="currentColor" dangerouslySetInnerHTML={{ __html: Spicetify.SVGIcons.play }} />