Template:UI/icon
Renders an inline SVG icon by name. Icons are bundled in
Template:UI/icon/styles.css (TemplateStyles) as `mask-image` data
URIs, so they color via the parent element's color property
and travel with the template — no per-wiki uploads needed.
Sized at 1em × 1em by default so an icon scales with its
surrounding text. Color comes from the parent's color
(via background-color: currentColor in the mask), so
dropping an icon next to text picks up the link/heading color
automatically.
Available name values: flask, users,
calendar, banknote, book,
sparkles, alert, mail,
user-plus, message-square, user-circle.
Use directly, or compose into other templates:
Parameters:
name— required; one of the bundled icon names. An unknown
name renders as an invisible span (no mask, no background) rather than a stray colored block, so typos fail closed.
Adding a new icon: append a .ui-icon-<name> rule to
Template:UI/icon/styles.css with the icon's SVG path data inside a
mask: url("data:image/svg+xml;utf8,<svg ...>...</svg>") no-repeat center / contain;
declaration. SVG stroke color doesn't matter — only alpha contributes
to the mask.