Skip to main content
Glama

CSS SOTA

by io.github.LuSrodri

Don't Make Me Think

dont_make_me_think
Read-only

UI/UX guidelines and a review of a page against them. mode="guidelines" returns the principles — Nielsen's 10 heuristics, Hick's and Fitts's laws, WCAG 2.2, neurodiversity-inclusive design, motion and microinteractions (including when Lottie or Rive are worth their bundle cost), SVG craft and animation, light-first theming, lightness and responsiveness — optionally filtered by topic. Read them BEFORE designing or building UI. mode="review" statically reviews supplied HTML and CSS, or a URL, and reports what violates which principle. The review reads source and does not render it, so it cannot measure computed contrast, real target sizes, or where focus lands — it catches what is visible in the markup, which is most of what actually goes wrong.

Input Schema

TableJSON Schema
NameRequiredDescriptionDefault
cssNoCSS source to review.
urlNoPage to fetch and review. Only the HTML and its inline styles are read — linked stylesheets are not followed, so pass `css` as well for a full review.
htmlNoHTML source to review.
modeNoguidelines: return the principles to design against. review: check HTML/CSS or a URL against them.guidelines
topicNoRestrict guidelines to one area. Omit for all of them. Ignored when mode is "review".

Output Schema

TableJSON Schema
NameRequiredDescriptionDefault
modeYes
countsYes
versionYes
findingsYes
reviewedYes
principlesYes

Schema Changelog

Changes observed during successful MCP inspections. Dates show when Glama detected each change.

  1. First observed

TDQS

A4.7/5.0
Behavior5/5

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

Beyond the readOnlyHint annotation, the description transparently discloses that review is static, does not render the page, cannot measure computed contrast, real target sizes, or focus placement, and that linked stylesheets are not followed. These limitations are exactly the kind of behavioral context that matters for correct invocation.

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 longer than typical but every clause adds value. It front-loads the core purpose and then details mode differences and limitations. A slight trimming of parenthetical examples could improve conciseness, but the structure remains logical and readable.

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

Completeness5/5

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

Given the tool's moderate complexity (two modes, five parameters, output schema), the description covers what each mode returns, how to filter, and what the static review can and cannot detect. With no output schema details provided, the description adequately explains behavior without needing to list return fields.

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

Parameters5/5

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

Although the schema already covers all parameters, the description adds crucial semantics: mode='guidelines' vs 'review', topic is ignored in review mode, and url only reads HTML and inline styles, requiring css to be passed separately. This goes beyond the schema's prose and meaningfully improves parameter understanding.

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 dual functions: returning UI/UX principles (guidelines mode) and reviewing HTML/CSS/URL against them (review mode). It names specific resources and behavior, and naturally distinguishes itself from CSS-feature siblings like audit_css or check_support by focusing on UX principles and page review.

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?

Explicitly tells when to use each mode: 'Read them BEFORE designing or building UI' for guidelines and 'statically reviews supplied HTML and CSS, or a URL' for review. It also advises passing css along with url for full coverage. It lacks an explicit 'when not to use' or alternative tool mention, but the context is strong.

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

All CSS SOTA toolsInspect
Try in Browser
RayrunBuild, deploy, and operate MCP servers without becoming an infrastructure team.ray.runAd

Glama MCP Gateway

Add one secure layer between your agents and this server.

TDQS

A4.4/5.0
Disambiguation4/5

Most tools have clearly distinct purposes: audit_css checks a stylesheet, check_support looks up browser versions for a specific feature, search_css_features finds features by keyword, and whats_new lists recent Baseline crossings. However, check_support and get_feature both provide browser support info, and get_feature also includes shipped versions, which could cause an agent to pick the wrong one for a quick lookup.

Naming Consistency4/5

All tool names use lowercase snake_case, which is consistent. Most follow a verb_noun pattern (audit_css, check_support, get_feature, search_css_features), but 'dont_make_me_think' is an idiomatic phrase and 'whats_new' is a question-like phrase, breaking the strict verb_noun consistency.

Tool Count5/5

With 6 tools, the server is well-scoped for its purpose of providing CSS support and Baseline information. Each tool covers a distinct aspect (auditing, lookup, search, news, deep-dive, and UX review), and none feels redundant or missing within the stated domain.

Completeness5/5

The tool set provides a complete workflow: audit a stylesheet, check specific support, search for features, get detailed feature info, and see what's new. There are no obvious gaps for a CSS support and Baseline status server, and the additional UI/UX review tool expands coverage without creating dead ends.

Resources