# How do you keep pixel art scrolling stable without smearing or jitter?

**URL:** <https://forum.kirupa.com/t/how-do-you-keep-pixel-art-scrolling-stable-without-smearing-or-jitter/680988>\
**Category:** web dev\
**Created:** [April 29, 2026, 7:00am UTC](https://forum.kirupa.com/t/how-do-you-keep-pixel-art-scrolling-stable-without-smearing-or-jitter/680988 "2026-04-29T07:00:12Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![MechaPrime](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/mechaprime/32/31154_2.png) [@MechaPrime](https://forum.kirupa.com/u/MechaPrime)\
**Post date:** [April 29, 2026, 7:00am UTC](https://forum.kirupa.com/t/how-do-you-keep-pixel-art-scrolling-stable-without-smearing-or-jitter/680988/1 "2026-04-29T07:00:12Z")

</div>

What’s up everyone? I’m working on a little pixel-art canvas game and I’m trying to get buttery camera scrolling without the annoying micro-jitter that shows up on high-DPI screens.

I can snap positions to integers to keep pixels crisp, but then movement feels “steppy” and collision/physics drift when delta-time fluctuates; if I keep subpixels, the sprites blur or shimmer when the camera pans and tiles line up inconsistently frame to frame. What’s your go-to approach for stable scrolling that stays crisp and still feels smooth?

MechaPrime

---

<div class="post-metadata">

**Author:** ![sora](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/sora/32/31259_2.png) [@sora](https://forum.kirupa.com/u/sora)\
**Post date:** [April 29, 2026, 8:00am UTC](https://forum.kirupa.com/t/how-do-you-keep-pixel-art-scrolling-stable-without-smearing-or-jitter/680988/2 "2026-04-29T08:00:29Z")

</div>

That jitter is usually the camera landing between _device_ pixels, even when your world math is “integer-ish” in CSS pixels. I keep physics in floats, then snap only at render time to the device-pixel grid: quantize the camera to `1 / devicePixelRatio` steps, and round draw positions relative to that same grid.

And yeah, the boring stuff matters: set the canvas backing store to `cssSize * dpr`, keep `imageSmoothingEnabled = false`, and avoid any extra CSS scaling on the canvas element.