Design Lounge

A UI design library and skill for agents, with a page review for AI giveaways, SEO, AEO, and GEO.

我該用這個嗎

品質與安全性

B
說明品質
89%
結構描述完整度
86%
命名品質
96%
汙染風險
80%
權限相符程度
90%
協定合規性
100%

發現項目(5)

  • HIGHTool poisoning patterns detected
  • MEDIUMTool 'audit_slop' description contains placeholder text在 audit_slop 中
  • LOWTool 'get_theme' description lacks action verb在 get_theme 中
  • LOWTool 'browse_library' suggests web access but openWorldHint=false在 browse_library 中
  • INFOTool description contains placeholder or incomplete text在 audit_slop 中

根據工具定義與協定合規性的自動化分析。

上下文成本

~3,429Token(工具定義)
~1.3 KB典型回應大小
顯著的注意力影響(128k 上下文的 2.68%)

這是每次將伺服器的工具載入模型上下文時所消耗的約略 token 數量。數量越高,可用於其他工作的注意力就越少。

安裝

一鍵安裝

將以下內容加入你的 `claude_desktop_config.json` 檔案:

{
  "mcpServers": {
    "design-lounge": {
      "command": "npx",
      "args": [
        "design-lounge-mcp"
      ]
    }
  }
}

可執行的套件

npmdesign-lounge-mcp0.2.3stdio

遠端端點

https://www.designlounge.live/api/mcpstreamable-http

它能做什麼

工具清單

工具(18)

🟢 唯讀🟡 寫入🔴 刪除⚪ 未知
🟢start_design(request, product, history)

Call first for any new website, app, screen, or UI. Reads their request the way the method does (flow, mode, named style, calm words), ranks the recipes, reads the project folder and the recent picks, and returns the brief to fill and the steps, each naming the tool to use.

輸入結構描述

{
  "type": "object",
  "properties": {
    "request": {
      "type": "string",
      "description": "Their message, word for word"
    },
    "product": {
      "description": "The product or brand name, if they gave one",
      "type": "string"
    },
    "history": {
      "description": "Recent pick lines, for a client that keeps its own history. The local server reads ~/.design-lounge/history.jsonl",
      "maxItems": 48,
      "type": "array",
      "items": {
        "type": "object",
        "propertyNames": {
          "type": "string"
        },
        "additionalProperties": {}
      }
    }
  },
  "required": [
    "request"
  ],
  "$schema": "http://json-schema.org/draft-07/schema#"
}
🟢get_recipe(id, product, history)

A recipe (start) with its directions: each a complete look (theme, pairing, family, hero, effect, work, footer). Each direction says whether the recent history blocks it.

輸入結構描述

{
  "type": "object",
  "properties": {
    "id": {
      "type": "string",
      "description": "Recipe id, such as saas, restaurant, portfolio. browse_library what=recipes lists them"
    },
    "product": {
      "type": "string"
    },
    "history": {
      "description": "Recent pick lines, for a client that keeps its own history. The local server reads ~/.design-lounge/history.jsonl",
      "maxItems": 48,
      "type": "array",
      "items": {
        "type": "object",
        "propertyNames": {
          "type": "string"
        },
        "additionalProperties": {}
      }
    }
  },
  "required": [
    "id"
  ],
  "$schema": "http://json-schema.org/draft-07/schema#"
}
🟢pick_direction(recipe, product, fitting, calm, history)

Apply rules 3 to 5 of Pick a direction and the Recent picks check: calm words narrow to quiet, editorial, or sharp families; the history blocks recent directions, heroes, and effects; the group check blocks two-of-three matches; the name number breaks the tie. You judge which directions fit the subject (rules 1, 2, 4) and pass them as `fitting`.

輸入結構描述

{
  "type": "object",
  "properties": {
    "recipe": {
      "type": "string"
    },
    "product": {
      "description": "Product or brand name, for the name number. Without one, the first noun of their message",
      "type": "string"
    },
    "fitting": {
      "description": "Direction ids whose mood names this subject's world",
      "type": "array",
      "items": {
        "type": "string"
      }
    },
    "calm": {
      "description": "They used a calm word: clean, simple, professional, plain, calm, quiet, corporate, serious, trustworthy",
      "type": "boolean"
    },
    "history": {
      "description": "Recent pick lines, for a client that keeps its own history. The local server reads ~/.design-lounge/history.jsonl",
      "maxItems": 48,
      "type": "array",
      "items": {
        "type": "object",
        "propertyNames": {
          "type": "string"
        },
        "additionalProperties": {}
      }
    }
  },
  "required": [
    "recipe"
  ],
  "$schema": "http://json-schema.org/draft-07/schema#"
}
🟢check_pick(recipe, product, direction, hero, work, ...)

The uniqueness check from Recent picks: direction, hero, and effect against this recipe; two of hero, work, footer against the related group; hero shape against the last two; frame against the last three. Returns problems and the Unlike line for the sheet.

輸入結構描述

{
  "type": "object",
  "properties": {
    "recipe": {
      "type": "string"
    },
    "product": {
      "type": "string"
    },
    "direction": {
      "type": "string"
    },
    "hero": {
      "type": "string"
    },
    "work": {
      "type": "string"
    },
    "footer": {
      "type": "string"
    },
    "effect": {
      "type": "string"
    },
    "shape": {
      "type": "string",
      "enum": [
        "split",
        "object",
        "type",
        "band"
      ]
    },
    "frame": {
      "description": "[header piece, phone piece or \"none\", find-us piece]",
      "minItems": 3,
      "maxItems": 3,
      "type": "array",
      "items": {
        "type": "string"
      }
    },
    "reuse": {
      "description": "Reusing a direction because every fitting one is recent: compares shape, frame, work, and footer only",
      "type": "boolean"
    },
    "history": {
      "description": "Recent pick lines, for a client that keeps its own history. The local server reads ~/.design-lounge/history.jsonl",
      "maxItems": 48,
      "type": "array",
      "items": {
        "type": "object",
        "propertyNames": {
          "type": "string"
        },
        "additionalProperties": {}
      }
    }
  },
  "required": [
    "recipe"
  ],
  "$schema": "http://json-schema.org/draft-07/schema#"
}
🟢search_pieces(query, platform, category, style, limit, ...)

Search 600+ piece briefs by words (job, component, style, tag) and filters. Returns ids, summaries, and demo links. Then get_piece for the brief.

輸入結構描述

{
  "type": "object",
  "properties": {
    "query": {
      "description": "Such as \"pricing toggle\", \"sticky mobile cta\", \"kanban\", \"footer wordmark\"",
      "type": "string"
    },
    "platform": {
      "type": "string",
      "enum": [
        "web",
        "mobile-web",
        "mobile-app",
        "pwa",
        "tablet"
      ]
    },
    "category": {
      "description": "browse_library what=categories lists them",
      "type": "string"
    },
    "style": {
      "type": "string"
    },
    "limit": {
      "type": "integer",
      "minimum": 1,
      "maximum": 40
    },
    "images": {
      "description": "Attach thumbnails of the first six, to compare them by eye",
      "type": "boolean"
    }
  },
  "$schema": "http://json-schema.org/draft-07/schema#"
}
🟢get_piece(id, full, image, demo)

The spec for one piece, with a picture of its demo: structure, counts, sizes, motion timing, states, hit targets, acceptance checklist. By default stops at "Optional below this line"; full=true adds the demo's exact paint and motion notes. demo=true adds the demo's HTML source, the acceptance file. Its colours and fonts are the demo's: translate them onto the locked kit.

輸入結構描述

{
  "type": "object",
  "properties": {
    "id": {
      "type": "string"
    },
    "full": {
      "type": "boolean"
    },
    "image": {
      "description": "Attach the demo's thumbnail (default true)",
      "type": "boolean"
    },
    "demo": {
      "description": "Add the demo's HTML source",
      "type": "boolean"
    }
  },
  "required": [
    "id"
  ],
  "$schema": "http://json-schema.org/draft-07/schema#"
}
🟢browse_library(what, mood, mode, limit)

List themes, pairings, families, recipes, piece categories, collections, or kinds. Themes and pairings can be ranked by a mood ("warm craft", "editorial serif", "dark technical").

輸入結構描述

{
  "type": "object",
  "properties": {
    "what": {
      "type": "string",
      "enum": [
        "themes",
        "pairings",
        "families",
        "recipes",
        "categories",
        "collections",
        "kinds",
        "motion",
        "scales"
      ]
    },
    "mood": {
      "type": "string"
    },
    "mode": {
      "type": "string",
      "enum": [
        "light",
        "dark"
      ]
    },
    "limit": {
      "type": "integer",
      "minimum": 1,
      "maximum": 100
    }
  },
  "required": [
    "what"
  ],
  "$schema": "http://json-schema.org/draft-07/schema#"
}
🟢get_theme(id, image)

A theme's full CSS (primary, secondary, tertiary, feedback, surfaces, link) and its pair for the other mode. Colour only: fonts come from the pairing, radius and shadow from the family.

輸入結構描述

{
  "type": "object",
  "properties": {
    "id": {
      "type": "string",
      "description": "Theme id, name, or Lounge link"
    },
    "image": {
      "description": "Attach a board of the theme's roles (default true)",
      "type": "boolean"
    }
  },
  "required": [
    "id"
  ],
  "$schema": "http://json-schema.org/draft-07/schema#"
}
🟢get_pairing(id, image)

A pairing's CSS (Google Fonts import, --font-display, --font-text, mono if any), its numbers face, and any caution to say before you write.

輸入結構描述

{
  "type": "object",
  "properties": {
    "id": {
      "type": "string",
      "description": "Pairing id, name, or Lounge link"
    },
    "image": {
      "description": "Attach a type specimen (default true)",
      "type": "boolean"
    }
  },
  "required": [
    "id"
  ],
  "$schema": "http://json-schema.org/draft-07/schema#"
}
🟢get_family(id)

A family's rules: radius, button style, density, shadow, and the sentences that lock them. The family wins over a brief for radius, shadow, button, and density.

輸入結構描述

{
  "type": "object",
  "properties": {
    "id": {
      "type": "string"
    }
  },
  "required": [
    "id"
  ],
  "$schema": "http://json-schema.org/draft-07/schema#"
}
🟢get_icons(names, group)

SVG for Lounge Icons by name (24px, stroke 1.75). With no names, lists them by group. Missing names come back as missing: then follow Icon and nav in components.md, never an emoji.

輸入結構描述

{
  "type": "object",
  "properties": {
    "names": {
      "type": "array",
      "items": {
        "type": "string"
      }
    },
    "group": {
      "type": "string"
    }
  },
  "$schema": "http://json-schema.org/draft-07/schema#"
}
🟢search_wada(query, near, limit)

Sanzo Wada's 348 combinations, by colour or material word (russet, slate, "dark warm") or nearest to a hex. Only for Free colour, a brand board no theme fits, or colours they asked for. Take one line whole; the header says how to map it to roles.

輸入結構描述

{
  "type": "object",
  "properties": {
    "query": {
      "type": "string"
    },
    "near": {
      "description": "A hex like #b14f1c",
      "type": "string"
    },
    "limit": {
      "type": "integer",
      "minimum": 1,
      "maximum": 30
    }
  },
  "$schema": "http://json-schema.org/draft-07/schema#"
}
🟢read_guide(file, section, outline)

Read a method file or one section of it. Files: SKILL.md, app.md, brief.md, components.md, examples.md, flows.md, locale.md, native.md, practice.md, reference.md, search.md, show.md, styles.md, taste.md, website.md. Give a heading ("Look", "Write the idea", "Recent picks") to get only that section; outline=true lists the headings.

輸入結構描述

{
  "type": "object",
  "properties": {
    "file": {
      "type": "string"
    },
    "section": {
      "type": "string"
    },
    "outline": {
      "type": "boolean"
    }
  },
  "required": [
    "file"
  ],
  "$schema": "http://json-schema.org/draft-07/schema#"
}
🟢name_number(name, count)

The tie-break from rule 5 of Pick a direction: the sum of each letter's place in the alphabet, mod the number of fitting directions.

輸入結構描述

{
  "type": "object",
  "properties": {
    "name": {
      "type": "string"
    },
    "count": {
      "type": "integer",
      "minimum": 1,
      "maximum": 9007199254740991
    }
  },
  "required": [
    "name"
  ],
  "$schema": "http://json-schema.org/draft-07/schema#"
}
🟢review_page(url, html, kit, render, out_dir, ...)

The all-in-one check for a built page: AI giveaways and kit drift (the Look fails), SEO, AEO, GEO, and, when Chromium is available, a rendered pass at 1280×800 and 390×844 with axe accessibility, measured labels, faces, primaries, tap targets, and saved screenshots. Returns scores, fails first, each with its evidence and fix.

輸入結構描述

{
  "type": "object",
  "properties": {
    "url": {
      "description": "A public URL, such as https://example.com",
      "type": "string",
      "maxLength": 2048
    },
    "html": {
      "description": "Raw HTML, when there is no file or URL",
      "type": "string",
      "maxLength": 2000000
    },
    "kit": {
      "description": "The locked kit, by id, name, or Lounge link. Read from DESIGN.md when omitted",
      "type": "object",
      "properties": {
        "theme": {
          "type": "string"
        },
        "pairing": {
          "type": "string"
        },
        "family": {
          "type": "string"
        },
        "named": {
          "description": "The Named aesthetic line, which lifts the bans it lists",
          "type": "string"
        },
        "free": {
          "description": "Show mode, Free: colour and type are not locked to the library",
          "type": "boolean"
        }
      }
    },
    "render": {
      "description": "Open it in Chromium (default true)",
      "type": "boolean"
    },
    "out_dir": {
      "description": "Where to save screenshots (default: a temp folder)",
      "type": "string"
    },
    "images": {
      "description": "Attach the web and phone frames (default true)",
      "type": "boolean"
    },
    "format": {
      "type": "string",
      "enum": [
        "markdown",
        "json"
      ]
    }
  },
  "$schema": "http://json-schema.org/draft-07/schema#"
}
🟢audit_slop(url, html, kit, render, out_dir)

Design only: the tells of a generated page (stock copy, em dashes, buzzwords, icon-card trios, gradients, the indigo palette, emoji icons, numbered eyebrows, placeholder copy, made-up numbers) and drift from the locked kit (faces, colours, radius, shadow). Static by default; render=true adds the measured checks.

輸入結構描述

{
  "type": "object",
  "properties": {
    "url": {
      "description": "A public URL, such as https://example.com",
      "type": "string",
      "maxLength": 2048
    },
    "html": {
      "description": "Raw HTML, when there is no file or URL",
      "type": "string",
      "maxLength": 2000000
    },
    "kit": {
      "description": "The locked kit, by id, name, or Lounge link. Read from DESIGN.md when omitted",
      "type": "object",
      "properties": {
        "theme": {
          "type": "string"
        },
        "pairing": {
          "type": "string"
        },
        "family": {
          "type": "string"
        },
        "named": {
          "description": "The Named aesthetic line, which lifts the bans it lists",
          "type": "string"
        },
        "free": {
          "description": "Show mode, Free: colour and type are not locked to the library",
          "type": "boolean"
        }
      }
    },
    "render": {
      "type": "boolean"
    },
    "out_dir": {
      "type": "string"
    }
  },
  "$schema": "http://json-schema.org/draft-07/schema#"
}
🟢audit_search(url, html)

Whether search engines can index the page and show it well (SEO), answer engines can lift a direct answer (AEO), and AI engines can reach it, read it without JavaScript, and name the entity (GEO): title, description, headings, alt, share card and its 1200×630 image, canonical, robots.txt for search and AI crawlers, sitemap, JSON-LD, question headings with short answers, server-rendered text.

輸入結構描述

{
  "type": "object",
  "properties": {
    "url": {
      "description": "A public URL, such as https://example.com",
      "type": "string",
      "maxLength": 2048
    },
    "html": {
      "description": "Raw HTML, when there is no file or URL",
      "type": "string",
      "maxLength": 2000000
    }
  },
  "$schema": "http://json-schema.org/draft-07/schema#"
}
🟢suggest_schema(url, html, type, name)

JSON-LD for the page built only from facts on it: the entity (Organization, LocalBusiness subtypes, Person, Product, SoftwareApplication) with name, url, description, image, phone, email, address, sameAs; and FAQPage from its own questions. Lists the fields it could not find. Never invents ratings, reviews, or prices.

輸入結構描述

{
  "type": "object",
  "properties": {
    "url": {
      "description": "A public URL, such as https://example.com",
      "type": "string",
      "maxLength": 2048
    },
    "html": {
      "description": "Raw HTML, when there is no file or URL",
      "type": "string",
      "maxLength": 2000000
    },
    "type": {
      "description": "schema.org type, such as Restaurant, Dentist, Person, SoftwareApplication. Default Organization",
      "type": "string"
    },
    "name": {
      "type": "string"
    }
  },
  "$schema": "http://json-schema.org/draft-07/schema#"
}

社群

為此伺服器評分

證據

近期觀測

已驗證未記錄版本18 個工具