mcpField
I
imagedimensions-mcp

imagedimensions-mcp

Local
github.com/Bishop81Developer Tools0Updated 11w ago
Repository

About imagedimensions-mcp

imagedimensions-mcp is an MCP server for developers auditing image performance on public web pages. Its server-side scan reports rendered versus natural sizes, oversized images, and image formats without a local browser.

Key features

  1. 01Compare natural and rendered dimensions
  2. 02Flag oversized images
  3. 03Report image format breakdown
  4. 04Count total and visible images
  5. 05Show modern-format share

Use cases

  1. 01Find oversized images on a page
  2. 02Review image formats during development
  3. 03Check potential image-related LCP slowdowns

MCP support

Exposes the scan_image_dimensions tool to MCP clients; it scans a public page URL server-side and returns a text report and structured results.

Configuration

Local server config is the same for every client. Copy it into your client’s MCP config file.

mcp.json · Universal config
{
  "mcpServers": {
    "bishop81-imagedimensions": {
      "command": "npx",
      "args": [
        "-y",
        "imagedimensions-mcp"
      ],
      "env": {
        "IMAGEDIMENSIONS_API_BASE": "<IMAGEDIMENSIONS_API_BASE>"
      }
    }
  }
}
Run commandnpx -y imagedimensions-mcp
Environment variables to set
IMAGEDIMENSIONS_API_BASEOverride the scan API base. Defaults to https://imagedimensions.com.

Local servers need a runtime on your machine (e.g. Node.js 18+). Config file locations differ by client; see your client’s docs.

Packages
npmimagedimensions-mcp0.1.2

Tools

1

Saved tool list · updated 3w ago

ParameterTypeRequiredDescription
urlstringYesThe public URL of the page to audit.
oversizedThresholdnumberNoArea-overshoot ratio above which an image is flagged oversized. Default 4 (≈2x in each dimension).

Details

From the project README

imagedimensions-mcp

An MCP server that audits the images on any public web page — natural vs. rendered dimensions, oversized-image detection, and format breakdown — so AI agents (Claude, Cursor, Windsurf, etc.) can check image performance during development.

Powered by imagedimensions.com. The scan runs server-side, so no local browser or Chrome install is required.

Install / run

// Claude Desktop / any MCP client config
{
  "mcpServers": {
    "imagedimensions": {
      "command": "npx",
      "args": ["-y", "imagedimensions-mcp"]
    }
  }
}

Tool

scan_image_dimensions
ParamTypeDescription
urlstring (required)Public URL of the page to audit.
oversizedThresholdnumber (optional)Area-overshoot ratio to flag as oversized. Default 4 (≈2× per dimension).

Returns a text report plus structured content:

  • total / visible image counts and CSS-background count
  • modern-format share (WebP + AVIF)
  • format breakdown
  • the list of oversized images (natural → rendered, overshoot ratio, format, src)
  • a link to the full visual report on imagedimensions.com

Example agent uses: "Audit the images on https://example.com," "Which images on this page are oversized and hurting LCP?", "What % of this site's images use modern formats?"

Why "oversized" matters

An image downloaded much larger than the box it renders into wastes bandwidth and slows Largest Contentful Paint — the most common image-performance mistake on the web. See the writeup.

Config

  • IMAGEDIMENSIONS_API_BASE — override the API base (default https://imagedimensions.com).

License

MIT

Comments

Markdown supported

New to MCP?

From what the protocol is to installing your first server, these answers cover most first questions.

An open protocol that defines how AI applications connect to external tools and data in a uniform way. Clients talk to the model; MCP servers provide tools, resources and prompt templates. They exchange standard messages, so one server can be reused by many clients.