StyleKit

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.

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.

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.

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.

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.

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.

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.

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.

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.

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"].