StyleKit
by AnxForever · remote · local (npm) · no sign-in to list tools · v0.5.0 · published by GitHub user AnxForever
MCP server for StyleKit styles, tokens, recipes, lint and repair over stdio or HTTP.
10 tools: 2 change things and 8 only read.
Scanned Oct 21, 2026
- Deletes or cancels0Claude Code: deny
- Can't be undone0Claude Code: ask
- Changes things2Claude Code: ask: see these tools
- Only reads8Claude Code: allow: see these tools
2 checks matched something in the tool definitions. No finding is not a safety guarantee. How the checks work.
claude mcp add --transport http stylekit https://www.stylekit.top/mcpFindings
Matches of fixed checks, with the text they matched.
The server marks "stylekit_lint_code" read-only (readOnlyHint: true), and its own name, description or input give the class "write".
What this check looks forMatched text
annotations: {"readOnlyHint":true,"destructiveHint":false,"idempotentHint":true,"openWorldHint":true}; The input takes a statement or command to run (input.code), which can change anything it can reach.
The server marks "stylekit_repair_code" read-only (readOnlyHint: true), and its own name, description or input give the class "write".
What this check looks forMatched text
annotations: {"readOnlyHint":true,"destructiveHint":false,"idempotentHint":true,"openWorldHint":true}; The input takes a statement or command to run (input.code), which can change anything it can reach.
Tools
Open a tool for its reasons and full description. Descriptions are the publisher's own words, shown as they are.
10 tools
Changes things 2Claude Code: ask
stylekit_lint_codeCheck whether code actually follows a style's rules.1 finding
Why it is in this group
- The input takes a statement or command to run (input.code), which can change anything it can reach.
- The server marks it read-only (readOnlyHint: true), but an annotation never lowers a class.
Findings
- Warn
The server marks "stylekit_lint_code" read-only (readOnlyHint: true), and its own name, description or input give the class "write".
What this check looks forMatched text
annotations: {"readOnlyHint":true,"destructiveHint":false,"idempotentHint":true,"openWorldHint":true}; The input takes a statement or command to run (input.code), which can change anything it can reach.
Description, as the server wrote it Check whether code actually follows a style's rules. Use this AFTER generating or editing UI code to verify it matches the style, instead of assuming it does. Reports forbidden classes with the reason they are banned and a concrete replacement. Understands JSX/HTML class attributes, cn()/clsx() calls, and template literals; variant prefixes (dark:, md:, hover:) are resolved before matching. Args: - slug (string): style identifier, e.g. "glassmorphism". - code (string): the source to check. JSX/TSX, HTML, or a bare class string. - checkRequired (array of 'button'|'card'|'input', optional): also report required classes the code is missing. Only pass components the code is supposed to contain. Returns JSON: { slug, ok, violations: [{ className, baseClassName, line, severity, source, rule, reason, fix }], missingRequired, checkedClasses, ruleSources, origin, contentSource, fallbackReason? }. Lint rules come from the same live implementation brief used for generation; its five-minute cache and any bundled fallback are reported separately from content provenance. Examples: - "does this button match neo-brutalist?" -> slug: "neo-brutalist", code: "<button className=...>", checkRequired: ["button"] - strict (boolean, default false): fail missing required classes in a static component snippet. Required checks cover the whole input, not each element. - status is pass, fail, or inconclusive. Runtime class expressions cannot be fully verified. ok is true only for a conclusive static pass; visual quality still needs review.
Annotations the server declares
- readOnlyHint: true
- destructiveHint: false
- idempotentHint: true
- openWorldHint: true
stylekit_repair_codeRewrite code that drifts from a style, using the style's own tokens as replacements.1 finding
Why it is in this group
- The input takes a statement or command to run (input.code), which can change anything it can reach.
- The server marks it read-only (readOnlyHint: true), but an annotation never lowers a class.
Findings
- Warn
The server marks "stylekit_repair_code" read-only (readOnlyHint: true), and its own name, description or input give the class "write".
What this check looks forMatched text
annotations: {"readOnlyHint":true,"destructiveHint":false,"idempotentHint":true,"openWorldHint":true}; The input takes a statement or command to run (input.code), which can change anything it can reach.
Description, as the server wrote it Rewrite code that drifts from a style, using the style's own tokens as replacements. Use this instead of hand-editing class names after stylekit_lint_code reports violations. Every applied rewrite comes from the style's tokens, never from a guess: variants (dark:, md:, hover:) are preserved, multi-class replacements are deduplicated, and string literals inside cn()/clsx() expressions are rewritten while variable references and interpolation spans are left untouched. JSX/HTML class attributes, template literals, and a bare class string are all handled. Spacing, layout and structure are never changed. Args: - slug (string): style identifier. - code (string, 1-100000 chars): source to repair. Returns JSON: { slug, code, edits: [{ from, to, line }], unfixed: [{ className, line, reason }], before, report, origin, contentSource, fallbackReason? }. Apply the returned code as-is, then review any entries in unfixed yourself — the rules flagged them but no concrete replacement exists. Examples: - "make this hero match neo-brutalist" -> slug: "neo-brutalist", code: "<section className=\"rounded-2xl shadow-2xl\">" - If edits is empty and before.status is "pass", the code already matched. Do not invent further changes.
Annotations the server declares
- readOnlyHint: true
- destructiveHint: false
- idempotentHint: true
- openWorldHint: true
Only reads 8Claude Code: allow
stylekit_get_assetRetrieve one public asset by its exact kind and id.No findings
Why it is in this group
- The name "stylekit_get_asset" says "get": a word for reading.
Description, as the server wrote it Retrieve one public asset by its exact kind and id. Source is returned only where the asset's contentLevel and license permit it. Remote templates include their actual file set only when the live source is available; if it is down, the tool returns a structured unavailable error with safe metadata and does not treat a download URL as source code. External and restricted assets expose metadata, license, attribution and source links only. Args: - kind: the namespace returned by stylekit_list_assets. - id: the exact identifier within that namespace. - includeSource (boolean, default true): include permitted source files/code; false returns metadata and links only. - files (array, optional): exact source file paths to include (templates); omit for all files. Unmatched paths are reported as missingFiles. Returns complete structured JSON and JSON text, preserving the namespace and provenance. Examples: - "show me the pricing template" -> kind: "template", id from stylekit_list_assets. - "just the page and styles" -> kind: "template", files: ["app/page.tsx", "app/globals.css"]. - A full template can return tens of thousands of characters; use includeSource: false or files to keep it small.
Annotations the server declares
- readOnlyHint: true
- destructiveHint: false
- idempotentHint: true
- openWorldHint: true
stylekit_get_component_recipeRender a ready-to-use component for a style: the full Tailwind className and JSX code.No findings
Why it is in this group
- The name "stylekit_get_component_recipe" says "get": a word for reading.
Description, as the server wrote it Render a ready-to-use component for a style: the full Tailwind className and JSX code. Components are usually "button", "card", "input" (check recipeIds via stylekit_get_style). Recipe data is read from the live catalogue with a five-minute cache; a bundled snapshot may be returned during an outage and is marked with origin and fallbackReason. Args: - slug (string): style identifier. - component (string): recipe id, e.g. "button", "card", "input". Returns JSON: { slug, component, className, code, origin, fallbackReason? }. Examples: - "give me a glassmorphism button" -> slug: "glassmorphism", component: "button" - Returns an error listing available recipes if the component isn't found.
Annotations the server declares
- readOnlyHint: true
- destructiveHint: false
- idempotentHint: true
- openWorldHint: true
stylekit_get_implementation_briefFetch one complete implementation contract before generating UI.No findings
Why it is in this group
- The name "stylekit_get_implementation_brief" says "get": a word for reading.
Description, as the server wrote it Fetch one complete implementation contract before generating UI. Use this when you need the full rules, CSS, templates, recipes and tokens in one call; the full payload is large (often 30k-60k characters). Pass sections to return only identity/provenance plus the parts you need. Args: - slug (string): style identifier. - sections (array, optional): philosophy, aiRules, doList, dontList, colors, globalCss, components, variants, tokens, recipes, readiness, lintRules. Returns JSON: { schemaVersion: "stylekit-brief-v1", slug, name, nameEn, category, styleType, description, tags, keywords, provenance, origin, fallbackReason?, sections?, plus the selected sections }. provenance.source records the content publisher (bundled, static, or community) and is distinct from transport origin. Coverage guidance does not certify visual quality or accessibility. Examples: - "build a landing page in glassmorphism" -> slug: "glassmorphism"; keep the returned stylekit-brief-v1 payload for later validation. - "just give me the rules and tokens" -> slug: "glassmorphism", sections: ["aiRules", "tokens", "lintRules"].
Annotations the server declares
- readOnlyHint: true
- destructiveHint: false
- idempotentHint: true
- openWorldHint: true
stylekit_get_shadcn_installGet the one-line shadcn CLI command that installs a style's color theme (light + dark) into a shadcn project.No findings
Why it is in this group
- The name "stylekit_get_shadcn_install" says "get": a word for reading.
Description, as the server wrote it Get the one-line shadcn CLI command that installs a style's color theme (light + dark) into a shadcn project. Args: - slug (string): style identifier. Returns JSON: { slug, command, registryUrl, prerequisite, lookupOrigin, fallbackReason? }. The command is derived from the style slug; lookupOrigin reports how StyleKit confirmed that slug. Examples: - "how do I install the synthwave theme?" -> slug: "synthwave" - The target project must have a tsconfig.json or the shadcn CLI errors out.
Annotations the server declares
- readOnlyHint: true
- destructiveHint: false
- idempotentHint: true
- openWorldHint: true
stylekit_get_styleGet one style's full profile: philosophy, palette, do/don't rules, keywords, and what's available (tokens, recipes, shadcn install).No findings
Why it is in this group
- The name "stylekit_get_style" says "get": a word for reading.
Description, as the server wrote it Get one style's full profile: philosophy, palette, do/don't rules, keywords, and what's available (tokens, recipes, shadcn install). Style data is read from the live catalogue with a five-minute cache; when live data is unavailable, a bundled snapshot may be returned and marked with origin and fallbackReason. Args: - slug (string): style identifier, e.g. "glassmorphism", "neo-brutalist". Returns JSON: { slug, name, nameEn, category, tags, description, philosophy, colors, doList, dontList, keywords, hasTokens, hasRecipes, recipeIds, shadcnInstall, url, quality, origin, fallbackReason? }. The content provenance is separate from origin when returned by the implementation brief. Examples: - "how should I use neo-brutalist?" -> slug: "neo-brutalist" - Returns an error with a hint if the slug is unknown.
Annotations the server declares
- readOnlyHint: true
- destructiveHint: false
- idempotentHint: true
- openWorldHint: true
stylekit_get_style_tokensGet a style's design tokens (Tailwind class mappings): border, shadow, typography, spacing, semantic colors, and forbidden/required classes.No findings
Why it is in this group
- The name "stylekit_get_style_tokens" says "get": a word for reading.
Description, as the server wrote it Get a style's design tokens (Tailwind class mappings): border, shadow, typography, spacing, semantic colors, and forbidden/required classes. Style data is read from the live catalogue with a five-minute cache; when live data is unavailable, a bundled snapshot may be returned and marked with origin and fallbackReason. Args: - slug (string): style identifier. Returns JSON: the full StyleTokens object plus origin (live or bundled) and optional fallbackReason. Content provenance is distinct from transport origin. Examples: - "give me the spacing and border tokens for bento-grid" -> slug: "bento-grid" - Returns an error if the style has no tokens registered.
Annotations the server declares
- readOnlyHint: true
- destructiveHint: false
- idempotentHint: true
- openWorldHint: true
stylekit_list_assetsBrowse StyleKit's public asset catalogue by namespace and query.No findings
Why it is in this group
- The name "stylekit_list_assets" says "list": a word for reading.
Description, as the server wrote it Browse StyleKit's public asset catalogue by namespace and query. Use the returned kind/id pair with stylekit_get_asset. Args: - kind (optional): one public namespace such as animation, component-pattern, template, or experience-pack. - query (optional): search public names, descriptions and tags. - offset (number >=0, default 0): results to skip. - limit (number 1-100, default 20): page size. Returns the full JSON page, including count, hasMore, next_offset, availability, contentLevel, license, attribution, source provenance, and kind counts. An empty page is a successful result. Private user kits and unpublished submissions are not listed. Examples: - "show me a pricing template" -> query: "pricing", then stylekit_get_asset with the returned kind/id. - Templates that include source files can be large; list first and fetch only the asset you need.
Annotations the server declares
- readOnlyHint: true
- destructiveHint: false
- idempotentHint: true
- openWorldHint: true
stylekit_search_stylesSearch StyleKit design styles by keyword and/or category, with pagination.No findings
Why it is in this group
- The name "stylekit_search_styles" says "search": a word for reading.
Description, as the server wrote it Search StyleKit design styles by keyword and/or category, with pagination. Exact slug or name matches are ranked first. Args: - query (string, optional): matches slug, name, description, tags, keywords (case-insensitive). - category ('modern'|'retro'|'minimal'|'expressive', optional): restrict to one category. - limit (number 1-50, default 15): page size. - offset (number >=0, default 0): results to skip (for paging). Returns structured JSON with total, count, offset, hasMore, next_offset (null on the last page), has_more as a deprecated alias, source, optional fallbackReason, and results. A valid query with no matches returns an empty results array, not a tool error. Examples: - "find a glassy frosted style" -> query: "glass" - "next page of retro styles" -> category: "retro", offset: 15 - For full tokens of one style, use stylekit_get_style_tokens instead.
Annotations the server declares
- readOnlyHint: true
- destructiveHint: false
- idempotentHint: 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.5.0. Values in angle brackets are yours to fill in.
claude mcp add --transport http stylekit https://www.stylekit.top/mcpRun in a terminal.
Claude Code permissions
Allow the reads, ask before a change, deny the deletes. Paste into .claude/settings.json.
{
"permissions": {
"allow": [
"mcp__stylekit__stylekit_search_styles",
"mcp__stylekit__stylekit_list_assets",
"mcp__stylekit__stylekit_get_asset",
"mcp__stylekit__stylekit_get_style",
"mcp__stylekit__stylekit_get_style_tokens",
"mcp__stylekit__stylekit_get_component_recipe",
"mcp__stylekit__stylekit_get_shadcn_install",
"mcp__stylekit__stylekit_get_implementation_brief"
],
"ask": [
"mcp__stylekit__stylekit_lint_code",
"mcp__stylekit__stylekit_repair_code"
],
"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 stylekit. Review it before you use it.
