how to disable anti-aliasing site wide for pixel art

If you don't know, anti-aliasing is the default method for making resized or low resolution images appear smoother and more accurate to the original image's intent by smoothing out pixels. This is great for most cases, but terrible if you actually want to maintain sharp pixels especially with pixel art on your site. Squarespace doesn't have anything built in yet to disable antialiasing for uploaded images, but  after doing some digging I found some CSS code that renders your pixels crisp and clean across your entire site, and across all major browsers. So far it's been working great with my site in the CSS code injection console so I'm sharing it here for anybody else who runs into the same issue I did. If you enter it in the CSS injection console as is, it applies site wide, but if you know some basic CSS, the same code can by applied to single pages or images as well. Feel free to comment tweaks, variations, updates ect.

img { 
    image-rendering: optimizeSpeed;             /* STOP SMOOTHING, GIVE ME SPEED  */
    image-rendering: -moz-crisp-edges;          /* Firefox                        */
    image-rendering: -o-crisp-edges;            /* Opera                          */
    image-rendering: -webkit-optimize-contrast; /* Chrome (and eventually Safari) */
    image-rendering: pixelated;                 /* Universal support since 2021   */
    image-rendering: optimize-contrast;         /* CSS3 Proposed                  */
    -ms-interpolation-mode: nearest-neighbor;   /* IE8+                           */

}