OutSystems developers have traditionally been forced to choose between SVG quality, Service Studio previews, and easy theming — but never all three.

Why Icon Tokens?

++ True SVG icons - crisp at any size, resolution-independent, and future-proof.

++ Service Studio previews - what you see is what you ship.

++ CSS-driven theming - change icon color and size using standard CSS.

++ No extra network requests - icons live in CSS tokens and are loaded with your stylesheet.

++ Design-system friendly - icons are defined once and reused everywhere through CSS variables.

Why NOT icon fonts?

-- Rendering inconsistencies - hinting, font smoothing, and alignment vary across platforms.

-- Hard to theme correctly - limited styling control and awkward overrides.

-- Not real SVG - no paths, no strokes, no true scaling.

-- Industry is moving away from them - icon fonts are increasingly considered legacy.

-- Accessibility issues - fonts were never designed for icons.

Why NOT InlineSVG from OutSystemsUI?

-- No Service Studio preview - developers work blind in the editor.

-- Requires runtime JavaScript - extra lifecycle hooks, more moving parts.

-- Harder to standardize - each usage becomes a special case.

Why NOT SVGs as image resources?

-- Extra network requests - each icon is a file fetch.

-- Limited theming - color changes require duplicating assets.

--Not design-system friendly - hard to centralize and evolve.

-- Less flexible sizing and states - hover, active, disabled states become cumbersome.

In conclusion, Icon Tokens is the current best way to add modern icons to your OutSystems applications.?