Maximum size of a element

by

Updated 10/13/2014

All tested browsers have limits to the height/width of canvas elements, but many browsers also limit the total area of the canvas element. The limits are as follows for the browsers I’m able to test:

Chrome:

Maximum height/width: 32,767 pixels
Maximum area: 268,435,456 pixels (e.g., 16,384 x 16,384)

Firefox:

Maximum height/width: 32,767 pixels
Maximum area: 472,907,776 pixels (e.g., 22,528 x 20,992)

IE:

Maximum height/width: 8,192 pixels
Maximum area: N/A

IE Mobile:

Maximum height/width: 4,096 pixels
Maximum area: N/A

Other:

I’m not able to test other browsers at this time. Refer to the other answers on this page for additional limits.

Exceeding the maximum length/width/area on most browsers renders the canvas unusable. (It will ignore any draw commands, even in the usable area.) IE and IE Mobile will honor all draw commands within the usable space.

More Related Contents:

  1. Using HTML5/Canvas/JavaScript to take in-browser screenshots
  2. Capture HTML Canvas as gif/jpg/png/pdf?
  3. Resizing an image in an HTML5 canvas
  4. Get pixel color from canvas, on mousemove
  5. Get a pixel from HTML Canvas?
  6. Can I turn off antialiasing on an HTML element?
  7. Zoom Canvas to Mouse Cursor
  8. Zoom in on a point (using scale and translate)
  9. how to save canvas as png image?
  10. Does HTML5/Canvas Support Double Buffering?
  11. Any way to clone HTML5 canvas element with its content?
  12. html 5 canvas LineTo() line color issues
  13. HTML5 Canvas camera/viewport – how to actually do it?
  14. Text wrap in a element
  15. How to resize html canvas element?
  16. How do I rotate a single object on an html 5 canvas?
  17. Detect if user clicks inside a circle
  18. addEventListener for keydown on Canvas
  19. How to determine the intended frame-rate on an html video element
  20. getting mouse position with javascript within canvas
  21. How to save canvas animation as gif or webm?
  22. clearRect not working
  23. canvas getContext(“2d”) returns null
  24. clearing circular regions from HTML5 Canvas
  25. draw 10,000 objects on canvas javascript
  26. Is there an equivalent of canvas’s toDataURL method for SVG? [closed]
  27. Body animation isn’t smooth
  28. HTML Canvas Full Screen
  29. javascript: upload image file and draw it into a canvas
  30. Extracting single frames from an animated GIF to canvas

Leave a Comment