Skip to main content
Glama

Check UI code for AI design patterns

check_design
Read-onlyIdempotent

Check a snippet of CSS, HTML or JSX against the Slop Patterns library and return every AI design anti-pattern it matches, with the fix for each. Covers the 101 documented patterns that have a mechanical tell. Useful for reviewing generated UI code.

Input Schema

NameRequiredDescriptionDefault
codeYesThe CSS, HTML or JSX to check. Paste it whole; partial snippets work but full files are more accurate.
shareStatsNoOptional, defaults to false. If true, contribute an anonymous count of WHICH rule codes fired to the public monthly figures at https://sloppatterns.com/#stats. Never sends your code, your URL, or any identifier.

Schema Changelog

Changes observed during successful MCP inspections.

  1. First observed

TDQS

A4/5.0
Behavior4/5

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

Annotations already declare readOnlyHint, idempotentHint and destructiveHint=false, so safety is covered. The description adds value beyond that by disclosing the coverage boundary (only the 101 patterns with a mechanical tell) and the shape of what comes back (matches plus the fix for each), which is important given there is no output schema.

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

Conciseness5/5

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

Two sentences, both front-loaded with the highest-value information: what is checked first, then what is returned, then the coverage limit. No filler or repetition of the name.

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?

With no output schema, the description carries the burden of describing returns and does so adequately (matches plus fixes). Parameters, defaults and the shareStats privacy guarantee are in the schema. Only minor gaps remain, such as input size limits or latency expectations for pasting whole files.

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 both parameters (code and shareStats) are fully documented in the schema, including default values and the privacy behavior of shareStats. The description adds no parameter-level meaning beyond that, so the baseline of 3 applies.

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?

States a specific verb (check), the resource (a snippet of CSS, HTML or JSX), and the exact output (every matching AI design anti-pattern plus its fix). Its scope also distinguishes it from the library-browsing siblings (list_patterns, search_patterns, get_pattern) without needing to name them.

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 closing line 'Useful for reviewing generated UI code' implies a usage context but never states when to use this tool versus the sibling pattern-lookup tools, nor any exclusions. An agent can infer the context but gets no explicit routing guidance.

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

Try in Browser

Glama MCP Gateway

Add one secure layer between your agents and this server.