Crisp pixel art guide: mention image-rendering & ctx.scale pitfalls

[Josh-Cena]

• Fix Crisp pixel art look with image-rendering: missing consideration of scaling with ctx.scale() #23847
• Fix This article is incomplete, css image-rendering: pixelated will not do that the article claims #36764

In #41232, I added a discussion about canvas grid-pixel alignment. This enables me to refer to that section elsewhere when we discuss sharp shape edges.

[github-actions]

Preview URLs

• /en-US/docs/Games/Techniques/Crisp_pixel_art_look
• /en-US/docs/Web/API/Canvas_API/Tutorial/Drawing_shapes

Flaws (2)

Note! 1 document with no flaws that don't need to be listed. 🎉

URL: /en-US/docs/Games/Techniques/Crisp_pixel_art_look
Title: Crisp pixel art look with image-rendering
Flaw count: 2

• unknown:
  • Error serializing baseline for numeric-seperators: missing field description``
  • Error serializing baseline for single-color-gradients: missing field description``

External URLs (5)

URL: /en-US/docs/Games/Techniques/Crisp_pixel_art_look
Title: Crisp pixel art look with image-rendering

• https://en.wikipedia.org/wiki/Compression_artifact (1 time) (Note! This may be a new URL 👀)
• https://en.wikipedia.org/wiki/Game_jam (1 time) (Note! This may be a new URL 👀)
• https://en.wikipedia.org/wiki/Indie_game (1 time) (Note! This may be a new URL 👀)
• https://en.wikipedia.org/wiki/Nearest-neighbor_interpolation (1 time) (Note! This may be a new URL 👀)
• https://en.wikipedia.org/wiki/Pixel_art (1 time) (Note! This may be a new URL 👀)

(comment last updated: 2025-09-22 04:00:26)