Every Material Symbol (Rounded, 400, grade 0) as <x-icon name="…" />, outlined or filled,
drawn from the optical size 24 cut or — for an icon 20px or smaller, where 24's strokes would look thin —
the 20 cut: <x-icon name="…" optical="20" class="size-5" />.
filled means active or selected; optical="20" when an icon is drawn at 20px or less; one weight per group. An icon takes the size and colour of the text beside it. An icon-only control carries an accessible name; a decorative icon is hidden.