Skip to main content
Glama

Measure an element (tokenless inspector)

measure_element

Inspect any web element's live computed styles, layout metrics, and WCAG color-contrast verdict to verify design-system and accessibility specifications without using screenshots.

Instructions

Zero-image element inspector: one element's live rendering spec from getComputedStyle and getBoundingClientRect — dimensions, position, typography, computed padding and margin, and ancestor-composited foreground/background colors with a WCAG AA (4.5:1) / AAA (7:1) contrast verdict including the large-text relaxation. Verifies design-system and a11y specs without image tokens.

Input Schema

TableJSON Schema
NameRequiredDescriptionDefault
urlYesAbsolute URL to open, e.g. http://localhost:5173.
reloadNoReload even if the URL is already open (default reuses it, so it can be stale after an edit).
selectorYesCSS selector for the target; first match wins. Playwright prefixes work too (text="Log in", role=button[name="Submit"]). Use "body" to scroll the page itself.
viewportNoSwitch to this breakpoint first. Default: keep the current one.
requireContrastNoCI gate: FAIL when text/background contrast misses this WCAG level (AA 4.5:1, AAA 7:1, large-text relaxation applies). Unverifiable gradients fail closed.

Schema Changelog

Changes observed during successful MCP inspections.

  1. First observedv0.29.0

TDQS

A3.9/5.0
Behavior4/5

Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?

With no annotations provided, the description carries the full burden of behavioral disclosure abbrevia. It transparently explains the mechanism (getComputedStyle and getBoundingClientRect), the computed values returned, ancestor-composited color handling, and WCAG contrast thresholds. It stops short of noting side effects like page reload or viewport switching, though those are covered by the schema.

Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.

Conciseness4/5

Is the description appropriately sized, front-loaded, and free of redundancy?

The description is a dense single sentence that front-loads the core identity and enumerates specifics without filler. It is slightly long and packed, but every phrase contributes functional information.

Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.

Completeness4/5

Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?

Given no output schema and no annotations, the description does well to explain what the tool returns and how the contrast verdict is derived. It covers the main dimensions, computed styles, color compositing, and verification purpose, leaving little ambiguity about call intent.

Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.

Parameters3/5

Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?

Schema description coverage is 100%, so the baseline is 3. The description adds overall output context but does not materially enrich the parameter semantics beyond what the schema already documents; contrast details like large-text relaxation are already present in the schema.

Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.

Purpose5/5

Does the description clearly state what the tool does and how it differs from similar tools?

The description states a specific verb-resource pair ('measure an element') and clearly differentiates itself from image-based tools with 'Zero-image element inspector' and 'without image tokens.' It enumerates concrete outputs such as dimensions, computed styles, and contrast verdict, so an agent can immediately identify its purpose.

Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.

Usage Guidelines3/5

Does the description explain when to use this tool, when not to, or what alternatives exist?

The description implies when to use it—verifying design-system and a11y specs—and contrasts with 'image tokens,' but it never names an alternative tool or gives explicit when-not-to-use guidance. The context is clear but exclusion logic is left to inference.

Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.