How to apply a pixelated effect to site

Design help General
1

I’m trying to create a retro pixel/bitmap effect for my page, eliminating the default smoothing/anti aliasing of fonts and shapes.

I’ve tried adding the following to my head code, or even as a custom HTML embed in the body, but no dice. Any ideas?

<style>
* {
  image-rendering: pixelated;
  image-rendering: -moz-crisp-edges;
  image-rendering: -o-crisp-edges;
  image-rendering: -webkit-optimize-contrast;
  -ms-interpolation-mode: nearest-neighbor;
}
</style>

Here is my site Read-Only: LINK
(how to share your site Read-Only link)

2

image-rendering: -webkit-optimize-contrast; Seems to cancel out image-rendering: pixelated; when applied to the same element. Without it, it works as intended.