When developing for iOS/macOS, I've really enjoyed using SF Symbols. In code they're handled like images, but respond to text scale factor and weight like fonts

When developing for iOS/macOS, I've really enjoyed using SF Symbols. In code they're handled like images, but respond to text scale factor and weight like fonts. Custom symbols are supported too so you're not just limited to what Apple provides. On the web, icon fonts seem like the natural parallel since they also "just work" when matching styles with text. To my knowledge, SVGs can't automatically match text size or weight which is a significant weakness, particularly when the user has specified overrides for accessibility reasons. But as the article states, icon fonts are bad because they're nonsense to screen readers. Is the only way to get an SF Symbols equivalent on the web, then, with SVGs and some JS wizardry?