Skip to main content
Glama

explain_styles

Explain why a CSS style does not apply by showing the winning declaration and the reason each competing rule lost.

Instructions

The core 'WHY': a per-property cascade verdict naming the winning CSS declaration and every loser with the exact reason it lost (specificity, !important, source order, inline, layer), each attributed to file:line or a WordPress/Elementor/Customizer origin. Reach for this whenever a style is wrong or 'won't apply' — wrong color/font/size/spacing, 'something is overriding my rule', 'where does this value come from', 'which rule do I edit'. Prefer this over grepping the source for a style bug: source search finds candidate rules, but only the live cascade shows which one actually WINS on a layered stack — so diagnose here before editing CSS you assume is the cause. Each winner also reports its BLAST RADIUS — how many other elements that rule styles (so you change THE button, not all buttons) — plus a scoped selector that targets just this element, with a specificity verdict. Pass an optional property (e.g. 'margin-bottom') to focus.

Input Schema

TableJSON Schema
NameRequiredDescriptionDefault
xNoViewport x coordinate — use together with y
yNoViewport y coordinate — use together with x
uidNoElement uid from a prior page_snapshot / find_elements
propertyNoCSS property (longhand or shorthand) to explain; omit for all competing/authored properties
selectorNoCSS selector (first match) — alternative to uid
Behavior4/5

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

No annotations provided, so description carries full burden. It discloses output content (winner, losers, reasons, blast radius, scoped selector) and implies read-only diagnostic nature. Does not explicitly state 'non-destructive', but context makes it clear. Could be more explicit about read-only behavior.

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

Conciseness3/5

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

Description is verbose (about 150 words) with some redundancy (e.g., repeated mention of winners and losers). The front-loaded bold phrase 'The core WHY' is effective, but overall could be more concise. Structure is good with bullet-like points but still longer than ideal.

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 complexity (5 params, no output schema, no annotations), the description covers key aspects: what the tool returns (verdict, reasons, blast radius, scoped selector) and how to use parameters. It lacks exact output format but is sufficient for correct invocation. Could be more complete for detailed output expectations.

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

Parameters4/5

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

Schema has 100% coverage with descriptions, and description adds value by explaining the 'property' parameter with an example ('margin-bottom') and context for other parameters (x/y as viewport, uid from prior snapshot). It also notes the optional property to focus, enhancing schema meaning.

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 clearly states the tool explains the CSS cascade verdict per property, naming winners and losers with reasons. It uses specific verbs like 'explain' and 'diagnose', and distinguishes from siblings by comparing to source search and style_diff. The resource is explicitly the CSS cascade.

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

Usage Guidelines4/5

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

Provides explicit when-to-use scenarios (wrong style, won't apply, overriding rule) and when-not (prefer over grepping source). It gives examples of symptoms and recommends diagnosing before editing. However, it doesn't explicitly contrast with all sibling tools like explain_animations or style_diff, but the guidance is strong enough.

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

Install Server

Other Tools

Latest Blog Posts

MCP directory API

We provide all the information about MCP servers via our MCP API.

curl -X GET 'https://glama.ai/api/mcp/v1/servers/mi60dev/visionaire-engine'

If you have feedback or need assistance with the MCP directory API, please join our Discord server