Image Resize Calculator

WHAT IT DOES

Image Resize Calculator is a floating panel that helps you determine the correct scaled dimensions for images while preserving or adjusting aspect ratio. Enter the original image's pixel width and height, then choose to scale by width, height, or percentage—the panel instantly calculates the new dimensions, scaling factor, and percentage of the original size. A "constrain proportions" toggle (enabled by default) ensures the aspect ratio is maintained; when disabled, you can set both width and height independently. The panel also displays the megapixel count and an estimated file size based on 24‑bit RGB color depth, helping you anticipate storage and upload requirements. You can insert the scaled dimensions or scaling factor directly into any editable field on the page (input, textarea, or contenteditable) with one click, or copy all results to your clipboard. Perfect for web designers optimizing images, photographers preparing files for print or social media, and developers needing quick dimension calculations.

WHERE IT RUNS

The panel overlays any website that loads the BotGentz extension—whether you're on a photo editor, a CMS dashboard, a design tool, a spreadsheet, or any other web page. It works on all modern Chromium‑based browsers (Chrome, Edge, Brave, Arc) and Firefox. The script injects a self‑contained UI element that does not interfere with the host page's layout, styles, or JavaScript execution. It runs client‑side only, with no external API calls or cloud dependencies.

HOW TO USE

After installing the free BotGentz extension, visit any page and click the extension icon to activate the panel. The first time you use Image Resize Calculator, it will appear as a draggable widget near the bottom‑right corner of your viewport. To calculate resize dimensions:

- Enter the original image width and height in pixels.

- Select a scaling mode from the dropdown: "Scale by width", "Scale by height", or "Scale by percentage".

- Enter the target width, target height, or percentage value depending on your selected mode.

- Toggle "Constrain proportions" on (default) to maintain aspect ratio; turn it off to set both dimensions independently.

The panel updates all calculations live—new size, scale factor, percent of original, megapixels, and estimated file size. To use the results:

- Click "Insert New Dimensions" to paste the scaled dimensions (e.g., "800 × 450 px") into the focused editable field.

- Click "Insert Scale Factor" to paste the scaling factor (e.g., "0.4167") into the focused field.

- Click "Copy All Results" to copy the new size, scale factor, percentage, megapixels, and file size estimate to your clipboard.

The panel remembers your last used scaling mode across sessions.

ASPECT‑RATIO‑LOCKED SCALING ENGINE WITH MULTI‑MODE INPUT

Unlike simple resize calculators that treat width and height independently, this panel uses a mode‑aware scaling engine that intelligently derives missing dimensions based on the user's selected scaling strategy. The engine maintains the aspect ratio (width ÷ height) as a primary constraint when "Constrain proportions" is enabled. In "Scale by width" mode, the engine computes the new height as targetWidth ÷ aspect, preserving proportion. In "Scale by height" mode, it computes new width as targetHeight × aspect. In "Scale by percentage" mode, both dimensions are multiplied by the percentage factor. When constraints are disabled, the engine allows independent dimension setting—the user can enter both width and height, and the engine calculates the scale factor as the geometric mean of the two scaling factors (or the width‑based scale if only width is entered). The engine also includes a precision rounding module that rounds dimensions to the nearest integer (pixels cannot be fractional) and scales the display values with appropriate formatting. The file size estimation uses a fixed 24‑bit color depth model (3 bytes per pixel) to provide a rough uncompressed size; this helps users understand storage needs without requiring a full image analysis.

THE PANEL

- Drag: Click and hold the panel's header bar to move it anywhere on the screen.

- Per‑site position: The panel stores its last position separately for each domain (e.g., different positions for Canva vs. WordPress) using the browser's localStorage, keyed by hostname.

- Snap: When dragged near any edge of the viewport, the panel snaps to that edge with a 16px margin for a clean, docked feel.

- Collapse: Click the "−" button in the header to collapse the panel to a compact title bar, preserving all current values. Click "+" to expand it back.

- Resize: Drag the bottom‑right corner handle to resize the panel from 280px to 600px wide and 200px to 500px tall; the layout adapts responsively.

- Escape: Press the Escape key while the panel is focused to close it entirely (you can reopen it from the extension toolbar).

PLEASE NOTE

This script requires the free BotGentz extension to run—it is not a standalone bookmarklet or user script. Websites frequently update their DOM structures and security policies; while we strive to keep the panel functional across thousands of sites, occasional updates may be needed. The calculator performs all operations entirely in your browser—no data is sent to any server, and no cookies or tracking identifiers are used. Your image dimensions and scaling values remain private to your local session and are persisted only via GM_setValue (the extension's local storage) for convenience, not shared across devices or sessions. File size estimates are based on uncompressed 24‑bit RGB data; actual file sizes may vary significantly depending on compression format (JPEG, PNG, WebP) and quality settings. Use the estimate as a rough guideline, not as a definitive storage requirement.