CSS SOTA

io.github.LuSrodri由 GitHub 帳號 LuSrodri 發布v0.1.0更新於 Oct 24, 2026

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

發布方自己的服務:Sota

已驗證Streamable HTTP可網頁執行網頁搜尋與抓取開發者工具

概覽

AI 產生的概覽

讓助理查詢 CSS 功能的 Baseline 狀態與瀏覽器支援,並檢查樣式表是否符合指定支援目標。

可以做什麼
提供六個工具,讓助理查詢 CSS 功能的 Baseline 狀態與日期、瀏覽器支援版本、規格連結、測試分數與 MDN 說明。可依關鍵字、Baseline 狀態與日期區間搜尋功能,列出近期跨過 Baseline 門檻的功能,並掃描 CSS 原始碼找出不符合指定瀏覽器支援目標的項目。另有工具提供 UI/UX 準則與頁面檢視。
適用情境
當你想知道某個 CSS 功能是否已可安全使用、哪些功能剛達到 Baseline,或需要檢查現有樣式表在指定瀏覽器清單下是否可用時使用。也適合在撰寫發行說明或進行 UI/UX 檢視時參考。
執行需求
遠端端點,無需本機執行環境或套件;未宣告驗證、環境變數或標頭。部分工具使用內附的 MDN 瀏覽器相容資料,不需網路呼叫。
安裝前請注意
工具會將查詢送往遠端端點及外部資料來源(如 Web Platform Dashboard 與 MDN)。audit_css 與 dont_make_me_think 會讀取你提供的 CSS 或頁面內容,請避免放入機密資訊。

安裝

在 SourceWeft 中

  1. 開啟 儀表板中的 CSS SOTA,將其新增到工作區。
  2. 為需要使用其工具的對話啟用該服務。

Web executable,透過 Streamable HTTP。 遠端服務在工作區中設定後即可從網頁執行環境執行。

交給代理程式安裝

把這段提示詞貼上到 Claude Code、Codex、Cursor 等代理程式,或 SourceWeft 對話中。代理程式會讀取該伺服器的安裝指南,先向你展示發布者、端點和登入方式,經你同意後再把它新增到你的客戶端。金鑰不會寫進任何命令。

閱讀 https://sourceweft.com/mcp/io.github.LuSrodri%2Fcss-sota-mcp/install.md,並按其中說明把這個 MCP 伺服器接入我的客戶端。修改任何設定之前,先告訴我它的發布者、端點和登入方式,等我確認。不要把 API 金鑰寫進命令或我會提交的檔案;問我金鑰應從哪裡取得。

檢視代理程式所依據的安裝指南

其他 MCP 客戶端

把它新增到你客戶端的 mcpServers 設定中。

{
  "mcpServers": {
    "css-sota": {
      "type": "http",
      "url": "https://css-sota-mcp.lusrodri.workers.dev/mcp"
    }
  }
}

README

該儲存庫沒有 README。

工具

6

search_css_features

Search CSS features

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.

輸入參數limitquerysinceuntilbaseline

whats_new

What's new in CSS

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.

輸入參數limitsinceuntiltransition

get_feature

Get CSS feature details

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.

輸入參數feature_id必填include_mdn

check_support

Check CSS browser support

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.

輸入參數valuebcd_keypropertyall_browsers

audit_css

Audit CSS against browser targets

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.

輸入參數source必填targetinclude_passing

dont_make_me_think

Don't Make Me Think

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.

輸入參數cssurlhtmlmodetopic

版本歷史

1
  1. v0.1.0最新Sep 16, 2026

評分

已滿足適用檢查項的 85%

該評分衡量此收錄條目的完整程度,依據註冊中心條目、端點與公開來源計算得出。它不是對伺服器本身的評價,也不表示伺服器安全或目前可用:可連通性是帶日期的檢查結果,評分也不包含安裝量或使用者評價。

  • 近 30 天內可連通必需25 分
  • 已宣告認證方式必需10 分
  • 已列出工具必需15 分
  • 描述必需15 分
  • 圖示10 分
  • 文件15 分

    請宣告包含 README 的 GitHub 儲存庫,或在 OAuth 受保護資源後設資料中提供 resource_documentation。

  • 授權條款10 分

其他 Sota 整合