How to fix blurry svg icons in chrome

Question

Our small (16px), circular icons suddenly degraded in quality on chrome with no change to our code or assets. The svgs look fine on a macbook screen, but blur on a monitor. Current running theory is a chrome update, but am looking for possible solutions/fixes. Any information or advice welcome.

example of blurry edges on an icon

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100">
  <path d="M50,0a50,50,0,1,0,50,50A50,50,0,0,0,50,0Zm0,91.6667A41.6667,41.6667,0,1,1,91.6667,50,41.6668,41.6668,0,0,1,50,91.6667Z"/>
  <g>
    <circle cx="49.2659" cy="75.9917" r="5.7828" fill="#6d6e71"/>
    <path d="M53.7632,63.0029H43.85c0-10.0845,5.03-15.1208,9.0712-19.1674,3.326-3.33,5.5236-5.5311,5.5236-10.2049,0-6.4239-6.9209-6.6089-7.71-6.6089-.3743,0-9.1787.0818-9.1787,7.16H31.642c0-11.2085,9.6047-17.0731,19.0922-17.0731,11.57,0,17.6239,8.3117,17.6239,16.5224,0,8.7764-4.6706,13.4524-8.4225,17.21C56.3524,54.4287,53.7632,57.0211,53.7632,63.0029Z" fill="#6d6e71"/>
  </g>
</svg>