Skip to content

CSS SOTA

by LuSrodri · remote · no sign-in to list tools · v0.1.0 · published by GitHub user LuSrodri

What CSS you can actually ship today, from live Baseline data and MDN browser-compat-data.

Changes · 3

6 tools: 3 change things and 3 only read.

Scanned Oct 21, 2026

No check matched anything in the tool definitions. No finding is not a safety guarantee. How the checks work.

claude mcp add --transport http css-sota https://css-sota-mcp.lusrodri.workers.dev/mcp

Tools

Open a tool for its reasons and full description. Descriptions are the publisher's own words, shown as they are.

6 tools

Changes things 3Claude Code: ask
  • audit_cssScan CSS source and report every feature in it that does not meet a browser support target.No findings

    Why it is in this group

    • Nothing in its name or description says what it does, so it is counted as a write.
    • The server marks it read-only (readOnlyHint: true), but an annotation never lowers a class.
    Description, as the server wrote it
    Scan CSS source and report every feature in it that does not meet a browser support target. Targets are either a Baseline level ("baseline-widely", "baseline-newly") or an explicit browser list ("chrome 120, safari 17.4, firefox 128"). Reports the offending line, what is wrong (unsupported, too old, prefix-only, partial), and the minimum version that would work. Browserslist queries like "last 2 versions" are not supported. IMPORTANT when reading Baseline-level results: Baseline describes a whole feature, and a feature can be "Limited" because one part of it is not interoperable while the exact declaration you wrote works everywhere. "Cursor styles" is Limited, so `cursor: pointer` is reported — yet it only lacks iOS Safari, where a cursor is meaningless rather than broken. Each finding therefore also names the browsers missing that specific key, or says that the key ships everywhere and the status comes from elsewhere in the feature. Read that line before removing anything: a key that ships everywhere is still not proof the code works, since it may be inert without the parts that do not.

    Annotations the server declares

    • readOnlyHint: true
    • openWorldHint: false
  • check_supportLook up which browser versions support a CSS property, value, selector, at-rule or function, from MDN browser-compat-data bundled with this server (no network call).No findings

    Why it is in this group

    • Nothing in its name or description says what it does, so it is counted as a write.
    • The server marks it read-only (readOnlyHint: true), but an annotation never lowers a class.
    Description, as the server wrote it
    Look up which browser versions support a CSS property, value, selector, at-rule or function, from MDN browser-compat-data bundled with this server (no network call). Give either a BCD key ("css.properties.anchor-name") or a property with an optional value ("display" + "grid"). Also reports vendor prefixes, partial implementations and the Baseline status of the feature the key belongs to.

    Annotations the server declares

    • readOnlyHint: true
    • openWorldHint: false
  • dont_make_me_thinkUI/UX guidelines and a review of a page against them.No findings

    Why it is in this group

    • Nothing in its name or description says what it does, so it is counted as a write.
    • The server marks it read-only (readOnlyHint: true), but an annotation never lowers a class.
    Description, as the server wrote it
    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.

    Annotations the server declares

    • readOnlyHint: true
    • openWorldHint: true
Only reads 3Claude Code: allow
  • get_featureGet everything known about one CSS feature: Baseline status and dates, the browser versions it shipped in, its description, spec links, Web Platform Tests scores, usage, and MDN re…No findings

    Why it is in this group

    • The name "get_feature" says "get": a word for reading.
    Description, as the server wrote it
    Get everything known about one CSS feature: Baseline status and dates, the browser versions it shipped in, its description, spec links, Web Platform Tests scores, usage, and MDN reference prose. Accepts a web-features id ("container-queries") or a display name ("Container queries"). Use search_css_features first if you do not know the id.

    Annotations the server declares

    • readOnlyHint: true
    • openWorldHint: true
  • search_css_featuresSearch CSS features on the Web Platform Dashboard (webstatus.dev) by keyword, Baseline status, and the date range in which they reached Baseline.No findings

    Why it is in this group

    • The name "search_css_features" says "search": a word for reading.
    Description, as the server wrote it
    Search CSS features on the Web Platform Dashboard (webstatus.dev) by keyword, Baseline status, and the date range in which they reached Baseline. Use this to answer questions like "which CSS features for scroll animations are Baseline yet?" or "what limited-support CSS is there for anchoring?". Returns live Baseline data. For the browser versions a specific property shipped in, use check_support instead.

    Annotations the server declares

    • readOnlyHint: true
    • openWorldHint: true
  • whats_newList CSS features that crossed a Baseline threshold within a date range, newest first.No findings

    Why it is in this group

    • The description's first verb is "list": a word for reading.
    Description, as the server wrote it
    List CSS features that crossed a Baseline threshold within a date range, newest first. Use this to answer "what CSS can I start using now?", to write release notes, or to catch up after time away. Defaults to the last 180 days. The date is when a feature became interoperable across browsers, which is usually well after it first shipped in one.

    Annotations the server declares

    • readOnlyHint: true
    • openWorldHint: true

This is not a safety rating, and no finding is not a safety guarantee. The groups and findings come from fixed checks of the tool definitions the server returned on the date shown, not from its code or what it does when called. How the checks work.

Install

Pinned to version 0.1.0. Values in angle brackets are yours to fill in.

claude mcp add --transport http css-sota https://css-sota-mcp.lusrodri.workers.dev/mcp

Run in a terminal.

Claude Code permissions

Allow the reads, ask before a change, deny the deletes. Paste into .claude/settings.json.

.claude/settings.json
{
  "permissions": {
    "allow": [
      "mcp__css-sota__search_css_features",
      "mcp__css-sota__whats_new",
      "mcp__css-sota__get_feature"
    ],
    "ask": [
      "mcp__css-sota__check_support",
      "mcp__css-sota__audit_css",
      "mcp__css-sota__dont_make_me_think"
    ],
    "deny": []
  }
}

Tools that only read are allowed, tools that change things ask first, tools that delete or cancel are denied. It assumes the server is installed as css-sota. Review it before you use it.