jQuery Forum

The PNG fallback is for older browsers/devices that do not support SVG. They are few today. Biggest group will be Android <4.0. I would just create fallback PNGs in the standard size, 18x18. Users with older Android devices with high-density displays will get ugly, scaled-up images. The owners of these devices are used to ugly, scaled-up images. Creating multiple PNG icons is just making a lot of unnecessary work for yourself to support a small number of users who should be encouraged to update their devices. ;)

If it makes sense for the icons within your widget to scale, scale them as you see fit with CSS. It might make sense to size them with some relative units (%, ems, etc.) or to use CSS media queries with breakpoints (a bit old-fashioned, I think.)

FWIW, trying to categorize devices into phone/tablet/desktop using width or height media queries today will just have you tearing your hair out. My preference is just to size everything (except borders) in ems, and give the user the ability to scale the whole thing.

rems might get you out of some sticky corners where you might have some icons that you do NOT want to scale with the rest of the UI. Unfortunately, they still aren't widely-enough supported.