Image Size Picker
kozzzhin
Image Size Picker is a tool for designers, developers, and anyone who works with images in the browser. One click gives you complete image metrics right on the page — no DevTools digging and no need to download the file. How to use Enable measurement mode from the extension icon or press Cmd+Shift+X / Ctrl+Shift+X. Hover over an image — a highlight frame appears around the visible image area. Click the image — a tooltip shows all dimensions. Press Esc to exit measurement mode. What you'll see Displayed — rendered size on the page in CSS pixels Original — native file resolution Physical — size accounting for screen density (Retina) Scale — how much the image is scaled up or down File size — weight in KB/MB Supported image types img and picture elements CSS background-image, masks, and pseudo-elements Images inside complex layouts and layered components Quality of life Clear active-mode indicators: ON badge, on-page pill, crosshair cursor Hover highlight matches the visible image bounds (object-fit, background-size) Links and buttons still work when you click outside an image Highlight hides while scrolling Privacy The extension runs locally in your browser. It does not send browsing data to any server. РУССКИЙ Image Size Picker — инструмент для дизайнеров, верстальщиков и всех, кто работает с изображениями в браузере. Одним кликом вы получаете полную информацию о картинке прямо на странице — без DevTools и без сохранения файла на диск. Как пользоваться Включите режим измерения через иконку расширения или горячую клавишу Cmd+Shift+X / Ctrl+Shift+X. Наведите курсор на изображение — появится рамка вокруг видимой области картинки. Кликните по изображению — откроется подсказка с размерами. Нажмите Esc, чтобы выключить режим. Что показывает расширение Отображается — размер картинки на странице в CSS-пикселях Оригинал — нативное разрешение файла Физический — размер с учётом плотности экрана (Retina) Масштаб — во сколько раз изображение сжато или растянуто Размер файла — вес в KB/MB Какие изображения поддерживаются Теги img и picture CSS background-image, mask, псевдоэлементы Картинки внутри сложной вёрстки и слоёв Удобства - Понятная индикация активного режима: badge ON, плашка на странице, курсор-прицел - Рамка при наведении точно повторяет видимую часть изображения - Клики по ссылкам и кнопкам не блокируются, если под курсором нет картинки - Рамка скрывается при прокрутке страницы Конфиденциальность Расширение работает локально в браузере. Данные о просматриваемых страницах никуда не отправляются.