Search code examples
imagedevtools

What does intrinsic value represent in dev tools when inspecting an image?


When inspecting an image in Chrome Dev Tools I notice that when hovering on the HTML it will display dimensions followed by other dimensions in parenthesis.

For example: 298 x 274 pixels (intrinsic: 860 x 731 pixels)

What is the meaning of the dimension in the parenthesis?


Solution

  • When you hover on the HTML it will display dimensions followed by other dimensions in parenthesis. For example: 298 x 274 pixels (intrinsic: 860 x 731 pixels)

    860 x 731 pixels is the image's actual size, and 298 x 274 pixels are the size after applying CSS to that image.