Skip to main content
Glama

Sekura Design MCP

A dockerized Model Context Protocol server that serves the complete Sekura Design System — tokens, components, layouts, UX patterns, accessibility contract and paste-ready code — to any MCP-capable tool.

Agents and developers can inspect the same tokens, native markup and interaction contracts. Application behavior still needs implementation and accessibility verification.

71 components · 16 foundations · 19 UX patterns · 9 layout recipes
120 semantic tokens · 4 themes · 3 densities · 8 target frameworks
Build-derived counts and support: sample/assets/component-manifest.json

The human-readable specification is DESIGN.md, and there is an 107-page documentation site — generated from the same data — that explains it with live demos, a full colour guide and worked examples.


Integration and migration

Sekura 3.2.1 removes inherited Workspace labels from examples and runtime UI, strengthens MCP guidance and adds upgrade checks for existing applications. It includes the 3.2.0 changes, which address the reliability and product issues found in the 3.1 review: locale-aware input commitment, shared date validation, keyboard suggestions, predictable overlay and toast cleanup, safer HTTP boundaries, correct token exports, framework lifecycle integration and consistent release artifacts. The 3.2 review record maps each finding to its implementation and verification scope.

Navigation keeps the fixed system width with no width control in the UI. The Documents sample has its own app frame, scoped page search and mobile Document actions. Component pages lead with an interactive example and separate API maturity, native framework support, design-kit coverage and verification. The Form integration lab demonstrates draft retention and revision comparison after a conflict or uncertain save acknowledgment.

Read the migration plan for separate v2, v3.0.0 and v3.1.0 upgrade paths, HTTP configuration changes and rollback. Public-name checks cover recorded v2.1, v3.0.0 and v3.1.0 baselines. The source patch targets 3.1.0 commit 115375177e0aff5e8dbadf39bdb55d0b10948f2c; older source branches must first integrate that upstream base. New design files use the versioned handoff guide.

Existing applications also need the example-identity cleanup: remove inherited Workspace labels from markup and runtime updates while keeping routes, IDs and saved data intact. Updating the MCP does not rewrite an existing app.

The support matrix distinguishes CSS, native behavior, controllers, and application-owned actions. The workbench compares every control size and density and demonstrates pending, failure, retry, cancellation and real undo. Example data stays local; simulated remote actions are labelled.

All 71 components have stable API maturity; native implementation and verification coverage are reported separately. The completed implementations include multi-select and async search, a reusable command palette, exact/range sliders, tri-state lazy trees, cancellable upload retries, and complete workspace/timeline states. npm run test:completion checks these contracts in Chromium, Firefox and WebKit. Human screen-reader and application acceptance remain documented separately in MANUAL-VALIDATION.md.

Generated framework code is an editable reference recipe, preserving the native markup, unique IDs and controller cleanup. The dedicated native React package exports Button, TextField, Textarea, Select, Checkbox and Switch; the other generated examples remain editable recipes. Read the emitted API before passing specification props. Keep one owner for controller state and wire your own permissions, network requests, persistence and navigation.

Version 2 corrects the accordion Tab sequence and replaces the old generated wrappers. See migration notes and the second design review and the original audit. No package or site is published by a local build.

Related MCP server: ds-canon

Quickest start

./run.sh start-build

Builds everything — TypeScript, contrast audit, CSS lint, stylesheets, the documentation site and the Docker image — then serves MCP and the documentation on :8080, with the docs at /docs/.

./run.sh build          Compile, run gates, emit CSS, build the docs and the image
./run.sh start          Start the MCP server and the documentation site
./run.sh start-build    Build, then start
./run.sh restart        Stop, then start
./run.sh stop           Stop everything
./run.sh logs [target]  Follow server logs
./run.sh status         What is running, plus a live contrast-audit check
./run.sh verify         Run every gate without starting anything
./run.sh clean [--all]  Remove build output, container and image
./run.sh help

The MCP server runs in Docker when Docker is available and falls back to a local Node process when it is not, so the script behaves the same either way. The published port and the image names are overridable: SEKURA_PORT, SEKURA_IMAGE, SEKURA_CONTAINER.

./run.sh status is a real check rather than a liveness ping — /health re-runs the full contrast audit, so a server quietly using a broken palette reports it.


The documentation site

./run.sh start-build          # then open http://localhost:8080/docs/

A 107-page documentation site — explanations, a full colour guide, a type specimen, live demos, a complete component reference and ten worked examples.

It is generated from the design system's own data, so the colour guide shows genuinely audited contrast values and the component pages show the same specification the MCP server serves. Browser regression tests check that the documented interactions work.

color.html

Every ramp step with its contrast against white and black, all 120 semantic tokens in four themes, and the full 86-pairing contrast contract with measured ratios

dark-mode.html

The elevation inversion, demonstrated with the same markup under both themes side by side — plus the nine things that break silently

layout.html

Flex-first, with resizable demos that reflow on container width

tokens.html

Filterable reference for every token

component-*.html

One page per component: anatomy, states, dark-mode note, full keyboard and ARIA contract

See sample/README.md for what to try.


Quick start

docker compose up -d
curl http://localhost:8080/health

Or without compose:

docker build -t sekura-design-mcp .
docker run -d -p 8080:8080 --name sekura sekura-design-mcp

The build runs the contrast audit and the full smoke test. An image whose palette breaks a declared WCAG pairing does not get built.

Local

npm ci
npm run build
npm run build:behaviours
npm run emit:css
npm run site:build
npm start              # stdio
npm run start:http     # HTTP on 127.0.0.1:8080

Connecting a client

Claude Code / Claude Desktop — HTTP

{
  "mcpServers": {
    "sekura-design": {
      "type": "http",
      "url": "http://localhost:8080/mcp"
    }
  }
}

Claude Code — one-liner

claude mcp add --transport http sekura-design http://localhost:8080/mcp

OpenAI Codex

Codex reads MCP servers from ~/.codex/config.toml. Add a [mcp_servers.<name>] table:

# ~/.codex/config.toml

[mcp_servers.sekura-design]
command = "docker"
args = ["run", "-i", "--rm", "-e", "SEKURA_MCP_TRANSPORT=stdio", "sekura-design-mcp:3.2.1"]

# The first call builds a 5,900-line overview, so allow a little headroom.
startup_timeout_sec = 30
tool_timeout_sec = 60

Without Docker, point it at the built server directly:

[mcp_servers.sekura-design]
command = "node"
args = ["/absolute/path/to/SekuraDesignMCP/dist/index.js"]

Recent Codex versions can add it for you:

codex mcp add sekura-design -- docker run -i --rm \
  -e SEKURA_MCP_TRANSPORT=stdio sekura-design-mcp:3.2.1

codex mcp list          # confirm it registered

Then just ask for work in design-system terms — Codex will call the tools:

> Build a settings page using the Sekura design system. Check the dark mode
> foundation before you write any CSS, and validate the markup when you're done.

Note on transport. stdio is the broadly supported path and is what the examples above use. Codex's support for remote url-based MCP servers is newer and has moved between releases — check codex mcp --help for your version before relying on the HTTP endpoint. Everything the server exposes is available over stdio, so nothing is lost.

Getting good results. The server's instructions already tell a client where to start, but these help:

  • Ask it to call get_overview first on a new task.

  • For anything visual, get_foundation({ id: "dark-mode" }) before writing CSS prevents the nine most common dark-mode defects.

  • Ask it to finish with validate_markup — the linter catches missing accessible names and hard-coded colours that a model will otherwise leave behind.

stdio (client spawns the container)

{
  "mcpServers": {
    "sekura-design": {
      "command": "docker",
      "args": ["run", "-i", "--rm", "-e", "SEKURA_MCP_TRANSPORT=stdio",
               "sekura-design-mcp:3.2.1"]
    }
  }
}

stdio (local install)

{
  "mcpServers": {
    "sekura-design": {
      "command": "node",
      "args": ["/absolute/path/to/SekuraDesignMCP/dist/index.js"]
    }
  }
}

Tools

Tool

Returns

get_overview

Start here. The map of everything, with the call needed to fetch each part.

search

Full-text search across components, foundations, patterns, layouts, tokens, behavior APIs and migration changes.

get_foundation

The reasoning: colour, dark mode, responsive layout, accessibility, typography, motion, i18n, theming…

list_components

The catalogue, filterable by category and maturity.

get_component

Full spec: anatomy, variants, sizes, states, props, tokens, dark-mode behaviour, complete accessibility contract, do/don't.

get_behavior

Runtime declarations, events, initialization, cleanup and application ownership.

get_migration_guide

Upgrade paths from v2 and v3.0, behavior changes, source-specific compatibility baselines and the optional v2 geometry bridge.

get_component_code

Paste-ready code in html, css, react, vue, svelte, angular, blazor or web-component.

get_layout

A complete page blueprint with markup and CSS.

get_pattern

A recurring UX problem, its solution, and the anti-patterns.

get_tokens

Resolved token values, showing all four themes side by side.

export_tokens

CSS, SCSS, W3C DTCG, Tailwind v3/v4, JS, TS, Swift, Android XML, Figma.

get_primitives

The raw colour ramps behind the semantic layer.

suggest_token

Describe an intent in words, get the right token with values per theme and why.

check_contrast

WCAG verdict for any pair — accepts hex or token names, resolves per theme, composites translucency.

audit_theme

Every declared pairing across every theme. The build gate.

validate_markup

Lints HTML/CSS for the failures that actually ship.

get_setup

HTML scaffold, pre-paint theme script, reset, utilities, prose, theme control.

get_stylesheet

The entire stylesheet as one file.

get_asset_urls

Published CSS, behavior and documentation artifact URLs.

validate_integration

Validate dependencies, initialization, markup references and declared action handlers.

Resources

sekura://tokens/css · sekura://tokens/dtcg · sekura://foundations/principles · sekura://foundations/dark-mode · sekura://components · sekura://behaviors · sekura://migration/v2-to-v3

Prompts

build-page · review-ui · implement-dark-mode


HTTP endpoints

Beyond MCP, the container serves plain HTTP so a build step can consume tokens without speaking the protocol:

Endpoint

Purpose

POST /mcp

MCP streamable HTTP endpoint

GET /health

Health check — re-runs the contrast audit, so a container serving a broken palette reports unhealthy

GET /tokens.css

CSS custom properties, all themes and densities

GET /tokens.json

W3C Design Tokens JSON


What makes this specification unusual

Dark mode is specified, not derived. Every component documents what changes in dark mode and why. The system encodes the rules most implementations get wrong: floating surfaces get lighter as they rise while recessed surfaces get darker; saturated fills step up the ramp so their labels flip to dark; borders go darker on dark, not lighter; and elevation is two tokens because a drop shadow is nearly invisible against a dark page.

get_foundation({ id: "dark-mode" }) lists the nine failures that pass a design review and break in production — the unstyleable Chrome autofill background, SVG chevrons baked into data URIs, WebKit's search clear button, scrims that are too weak on dark, and so on.

The contrast contract is machine-verified. 86 declared pairings × 4 themes = 344 checks, run on every build and by the container's health check. Two neutral steps are pinned by contrast rather than by eye: neutral-400 is the lightest grey clearing 3:1 on white, and neutral-500 the lightest clearing 4.5:1 on the subtle surface. Moving either lighter breaks a promise, and the audit catches it.

Sekura exceeds WCAG in three places where products commonly fail: placeholder text and tertiary text are both held to full body contrast, and switch and progress tracks are treated as meaningful graphics rather than decoration.

Layout is flex-first. Composition primitives wrap rather than overflow, children declare flex explicitly, text-bearing flex children set min-inline-size: 0, and widths are flex-basis (an ideal) rather than width (a demand). Most layouts therefore respond to their container and need no media query — including the two-column sidebar-layout, which stacks purely through flex wrapping.


Example session

> get_overview
  → the full map

> get_foundation({ id: "dark-mode" })
  → the nine silent failures, the elevation inversion, theme-switching rules

> get_layout({ id: "list-page" })
  → regions, responsive strategy, a11y obligations, markup + CSS

> get_component({ id: "table" })
  → 6 variants, 6 states, full keyboard model, and why row separators
    go DARKER in dark mode

> get_component_code({ id: "table", framework: "react" })
  → typed component forwarding the required ARIA attributes

> suggest_token({ intent: "border around a card in dark mode" })
  → --sk-color-border-default, values per theme, and why

> check_contrast({ foreground: "#8590a3", background: "#ffffff", use: "ui-component" })
  → 3.22:1 — AA pass for control boundaries

> validate_markup({ markup: "<button><svg/></button>" })
  → ❌ button-accessible-name, with the fix and the WCAG criterion

> audit_theme
  → 344/344 pairings satisfied across all four themes

CI and releases

Two workflows in .github/workflows/.

ci.yml runs on every push and pull request. Each step is a gate that exits non-zero, so a change that breaks a promise cannot merge green:

Gate

Checks

check:version

No version literal has drifted from package.json

check:deps

No pre-release dependencies; every Node reference an LTS line

check:env

.env.example documents every setting, and only real ones

audit:contrast

344 checks — 86 declared pairings across four themes

lint:css

Structure, tokens only, no physical properties

smoke

Every MCP tool, component, framework and export format

test:color

Colour maths against WCAG reference values

test:urls

Path prefixes and proxy headers resolve to reachable URLs

test:reliability:server

Bounded validation, composited contrast, exact token exports, HTTP boundaries, cache refresh and artifact health

test:reliability:inputs

Locale drafts, shared date validation, keyboard suggestions, nested cleanup and focused toast queue

test:reliability:product

Storage failure, filtered contents, dedicated Workspace and component preview behavior

test:reliability:form

Conflict comparison, uncertain save outcomes and explicit recovery without draft loss

test:consumers

Packed ESM/CJS, strict declarations, real Angular SSR/hydration and Blazor Server cleanup

test:release-policy

Existing-tag resolution and verified-artifact release invariants

test:codegen

React, Angular and Web Component typechecks; Vue/Svelte compilation; Angular templates

test:blazor

All generated Razor components compile with .NET 10

test:design

Example workflows, control alignment, generated React mounts, lifecycle and mobile geometry

test:completion

Advanced components, async cleanup, RTL accents and narrow layouts in three browsers

test:behaviours

Real key presses in a browser: focus, ARIA, Escape, inert

site:publish

Static bundle is portable — nothing root-absolute

test:errors

Every failing tool call is marked, coded and actionable

test:announce

Accessible names exist and are distinct within a region

test:rtl

Nothing clipped in either direction, at four widths, including 320px, across 14 pages

verify:sample

Dangling references, broken links, markup lint

test:a11y

axe-core, WCAG 2.2 AA, both themes

Docker

Image builds, /health re-runs the contrast audit inside it

release.yml runs on a v* tag and publishes artifacts.

The 3.2.1 source patch already sets the release version. Commit and push the reviewed source on main first. When ready to publish that committed version, tag it without running another version bump:

sekura_release_version=$(node -p "require('./package.json').version")
git tag -a "v${sekura_release_version}" -m "Sekura ${sekura_release_version}"
git push origin "v${sekura_release_version}"

The workflow refuses to release if the tag disagrees with package.json — otherwise you ship artifacts labelled one version and containing another. It then runs the full gate chain again (a release cannot skip checks) and publishes:

Artifact

Use

sekura-<v>.css

The whole stylesheet, one file

tokens-<v>.css

Custom properties only, all themes and densities

tokens-<v>.dtcg.json

W3C Design Tokens format

sekura-behaviours-<v>.iife.min.js

Drop-in <script>, global Sekura

sekura-behaviours-<v>.esm.min.js

ES module for bundlers

sekura-css-<v>.zip

Per-component CSS, Tailwind, Swift, Android

sekura-docs-<v>.zip

The documentation site, hostable anywhere

SHA256SUMS.txt

Checksums

Stable releases also publish a multi-arch image to GHCR, tagged 1.2.3, 1.2, 1 and latest. Alpha releases use their exact version tag and do not update latest or the stable documentation site. After publishing the release:

docker run -d -p 8080:8080 ghcr.io/mictsi/sekuradesignmcp:3.2.1

Stable releases deploy the documentation site to GitHub Pages.

Versioning

package.json is the single source of truth. The server, docs site, behaviours bundle and container tag all derive from it — check:version fails the build if a literal creeps back in.

A major bump is required for anything that breaks consumers silently: renaming a semantic token or component class, changing a keyboard contract, removing an MCP tool, or changing the focus ring or spacing scale. Changing a primitive value is a minor bump, because the semantic layer absorbs it and the contrast audit proves nothing regressed. See CHANGELOG.md.


Development

npm run verify          # full checks; Node/npm, Chromium, Firefox, WebKit and .NET 10 SDK required
npm run build           # compile
npm run check:version   # no version literal has drifted
npm run check:deps      # dependency policy: stable releases, Node LTS only
npm run check:env       # .env.example matches what the code actually reads
npm run test:color      # colour maths vs WCAG reference values
npm run test:urls       # URL generation under prefixes and reverse proxies
npm run audit:contrast  # 344 contrast checks — build gate
npm run lint:css        # structural CSS lint over all 83 emitted stylesheets
npm run smoke           # checks every tool, component and export
npm run emit:css        # write dist-css/ and the dependency/event manifest
npm run site:build      # regenerate the 107-page documentation site
npm run verify:sample   # lint every page against the design system itself

lint:css exists because component CSS is a string as far as the TypeScript compiler is concerned. It checks for unbalanced braces, selectors running into at-rules, hard-coded colours, unknown tokens and physical properties — it was added after building the sample surfaced an invalid selector in the dialog stylesheet that had shipped unnoticed.

npm run emit:css produces standalone artefacts for consuming Sekura as plain files: sekura.css (everything), tokens.css, tokens.dtcg.json, tailwind.config.js, SekuraColor.swift, android-resources.xml, tokens.figma.json, per-component CSS, and component-manifest.json with dependency and behavior metadata.

Layout

src/
├── index.ts              entry, transport selection
├── server.ts             MCP server: design, runtime and migration tools, resources and prompts
├── http.ts               streamable HTTP transport, health, plain-HTTP token endpoints
├── site/                 documentation site generator
│   ├── shell.ts          page shell, navigation, reusable doc blocks
│   └── pages.ts          every page, built from the data below
├── data/
│   ├── primitives.ts     ramps, scales, type scale, elevation, motion, breakpoints
│   ├── semantic.ts       120 tokens × 4 themes + the contrast contract
│   ├── tokens.ts         resolution and audit
│   ├── base-css.ts       reset, utilities, prose, theme runtime
│   ├── foundations.ts    15 foundation documents
│   ├── layouts.ts        9 page recipes
│   ├── patterns.ts       15 UX patterns
│   └── components/       67 component specifications
└── lib/
    ├── color.ts          WCAG luminance, contrast, compositing
    ├── exporters.ts      11 output formats
    ├── codegen.ts        8 target frameworks
    ├── validate.ts       markup linting
    ├── markdown.ts       minimal renderer for the foundation documents
    ├── suggest.ts        intent → token
    └── search.ts         weighted full-text search

Settings

Every setting, with what it does and when you would change it, is documented in .env.example — including the path variables this section used to omit. See Configuration for how to use the file.

A second list here would drift from that one, which is the failure npm run check:env exists to prevent.


Notes

The HTTP server is stateless — a fresh server per request, no sessions to lose. The design system is read-only at runtime, so the container runs unprivileged with a read-only filesystem and all capabilities dropped.

Supported runtimes

Node 22 (Jod) and 24 (Krypton) — the two Node LTS lines currently in support. The container builds on 24; CI runs every gate on both, so engines: >=22 is a verified claim rather than an aspiration.

Node 25 did not become LTS, and Node 26 is still Current on 2 October 2026. npm run check:deps enforces the currently supported LTS window. The window must be reviewed as Node's release policy changes with version 27.

What the build actually needs

The container build needs Docker and nothing else. The Dockerfile installs its own dependencies, compiles inside the image, and runs its own gates there, so the host toolchain is never involved:

./run.sh build --image      # or plain: docker build -t sekura-design-mcp .

The source-build path is self-contained. For 3.2.1, local checks cover the Docker/release policy and the HTTP readiness contract; an actual image build, container probe and live workflow run remain release acceptance steps.

Plain ./run.sh build does more than that: it also compiles and verifies on the host before building the image, which is why it wants TypeScript and Playwright. The script installs the revisions locked by playwright-core for behavior, RTL, cross-browser and design-kit checks. These steps are skippable:

Command

Needs

./run.sh build --image

Docker

./run.sh build --no-browser

Node and npm; Docker when available

./run.sh build

Node, npm, Docker when available, and browser downloads

--no-browser skips the browser tests and CSS capture for the Figma kit. The React package, stylesheets and documentation still build. The full build reinstalls dependencies if they differ from package-lock.json, avoiding stale local packages after Dependabot updates.

The full build installs Chromium, Firefox and WebKit through the locked Playwright CLI. To install them separately, run node node_modules/playwright-core/cli.js install chromium firefox webkit.

Configuration

Every container setting lives in one file.

cp .env.example .env      # then edit .env, which is gitignored

docker compose up, ./run.sh start and docker run --env-file .env all read it, so there is a single place to look when a deployment misbehaves. Anything already exported wins, so SEKURA_PORT=9000 ./run.sh start still works for a one-off.

npm run check:env fails the build if the code reads a setting .env.example does not document, or documents one nothing reads — a setting someone will set, restart for, and watch do nothing is worse than an undocumented one. It also rejects quoted values, because docker run --env-file keeps the quotes as part of the value while Compose strips them.

Publishing under a path

The MCP endpoint, the health check and the documentation site are served from one port under one path prefix. There is no second port and no second server:

http://host:8080/<app_path>/mcp        MCP, POST
http://host:8080/<app_path>/health     health
http://host:8080/<app_path>/docs/      documentation site

The image serves at the root by default. To publish it under a path on an existing web server — https://example.com/design-system/ — you need to know which of two things your proxy does, because they need different settings.

Variable

Answers

SEKURA_BASE_PATH

Where does this process listen?

SEKURA_EXTERNAL_URL

What does the outside world see?

They are equal in the simple case and different in the common one, which is why they are two variables rather than one.

If the proxy passes the prefix through, the app has to answer on /design-system/health:

location /design-system/ {
    proxy_pass http://app:8080/design-system/;   # prefix kept
    proxy_set_header Host $host;
    proxy_set_header X-Forwarded-Proto $scheme;
}
docker run -d -p 127.0.0.1:8080:8080 \
  -e SEKURA_BASE_PATH=/design-system \
  -e SEKURA_EXTERNAL_URL=https://example.com/design-system \
  sekura-design-mcp:3.2.1

If the proxy strips the prefix, the app still listens at the root but has no way to discover what was removed, so it must be told:

location /design-system/ {
    proxy_pass http://app:8080/;                 # prefix stripped
    proxy_set_header Host $host;
    proxy_set_header X-Forwarded-Proto $scheme;
}
docker run -d -p 8080:8080 \
  -e SEKURA_EXTERNAL_URL=https://example.com/design-system \
  sekura-design-mcp:3.2.1

With Traefik or ingress-nginx, pin SEKURA_EXTERNAL_URL when the public URL is known. Forwarded headers are honored only from peers explicitly listed in SEKURA_TRUST_PROXY; the default is false, and legacy true means loopback only. The edge must overwrite each forwarded header with a single value.

Host validation applies to the incoming Host and any trusted forwarded host. Loopback hosts and the external URL's host are included automatically; add other intended authorities to SEKURA_ALLOWED_HOSTS. Browser requests must use the resolved server origin or an explicit SEKURA_ALLOWED_ORIGINS entry. Missing Origin is allowed for non-browser clients. These checks do not add authentication or CORS. See .env.example and the HTTP upgrade section for exact values.

Check binding and built artifacts

Inspect /health for contrast and artifact status. Missing sekura.css or sekura.iife.min.js now produces a 503; build or copy matching artifacts before starting the service. Documentation availability is reported separately.

If the container is healthy but unreachable, inspect HOST. A published port forwards to the container's external interface; HOST=127.0.0.1 binds the container's own loopback instead, so nothing on the host can connect — while the container's health check, probing from inside, passes and Docker reports it healthy.

./run.sh start now names this when it happens, and the server warns at startup. To restrict access, leave HOST=0.0.0.0 and narrow the mapping instead: -p 127.0.0.1:8080:8080.

Ports

Two, and only two:

SEKURA_PORT

Published port — what the outside world connects to

PORT

Internal port — what the server listens on in the container

They meet at the port mapping (-p ${SEKURA_PORT}:8080). Change the published one; leave the internal one alone, or the healthcheck, the EXPOSE and the mapping have to be kept in step by hand.

What gets published

Every path below is relative to the mount point. There is no route outside it — not even a redirect from /. A deployment reachable at two addresses is one where a link, a bookmark or a proxy rule eventually points at the wrong one.

Path

What

/mcp

MCP endpoint (POST). Rename with SEKURA_MCP_PATH

/health

Required artifact availability and the declared contrast audit; 503 if degraded

/manifest.json

Every URL above and below, as JSON

/tokens.css

Custom properties, all themes and densities

/tokens.json

W3C DTCG format

/css/sekura.css

The complete stylesheet; /css/ also has per-component files

/js/sekura.iife.min.js

Behaviours, drop-in <script>; .esm.min.js alongside

/docs/

The 107-page documentation site

Do not assemble those paths by hand from a base you assume. Fetch /manifest.json, or call the get_endpoints MCP tool — only the server knows what prefix it is actually reachable on, and both report the real URLs including anything a proxy rewrote.

curl -s https://example.com/design-system/manifest.json | jq .artefacts.stylesheet.url
# "https://example.com/design-system/css/sekura.css"

The documentation site uses relative links throughout, so it is portable to any prefix with no rebuild.

Errors, for a model rather than a developer

The caller of an MCP server is a language model. That changes what a good error is: a model that receives "Unknown component" in a success envelope has no signal anything went wrong, and will carry on and invent the component.

Every failure from this server is marked isError, and carries:

Field

Why

code

UNKNOWN_COMPONENT — branchable without parsing English

hint

One of RETRY_LATER, CHECK_INPUT, TRY_ALTERNATIVE, REPORT_TO_USER

Closest matches

Ranked by edit distance, never the whole namespace

retryable

So a model does not retry something that cannot succeed

traceId

So a bug report can name one specific response

ERROR UNKNOWN_COMPONENT

No component with that id.

Received: "datepicker"

Closest matches:
  - date-picker
  - date-range-picker

Next:
  - Call `list_components` for the full list.

Recovery hint: TRY_ALTERNATIVE
Retryable: no — the same call will fail again. Change the arguments first.
This is an error, not content. Do not include it in generated output.

An empty result is not an error, and says so explicitly with count: 0. A model cannot otherwise tell "there genuinely are none" from "something broke and returned a default", and the second is a false claim of safety.

npm run test:errors enforces all of this — 94 checks.

Publishing the documentation as a static site

npm run site:publish        # -> dist-site/

dist-site/ is self-contained: 107 pages, the assets, and a 404 page. Upload it anywhere. Every reference in it is relative, so the same bundle serves from a domain root or any subdirectory with no rebuild:

dist-site/  ->  https://example.com/
            ->  https://example.com/design-system/

The command is a gate, not just a copy. It refuses to produce a bundle containing a root-absolute href or src, because that is the failure that works locally, works at a domain root, and 404s under a subdirectory — which is where most bundles end up.

The running container serves the same site at <app_path>/docs/, so publishing statically is an alternative to it rather than a prerequisite.

Licence

MIT — see LICENSE.

Contributing: CONTRIBUTING.md · Security: SECURITY.md · Changes: CHANGELOG.md

Review follow-ups

  • npm run build:react: builds the versioned local @sekura/react package with Button, TextField, Textarea, Select, Checkbox and Switch. See the API contract.

  • npm run build:design-kit: derives six Figma component sets (216 theme/density/state variants) from emitted CSS. See import instructions and coverage. It is a starter library requiring visual review in Figma before publication.

  • npm run demo:server: serves the form-composition lab at http://127.0.0.1:4173/form-lab.html, with same-origin HTTP validation, save and version-conflict endpoints. Data lives in memory. These endpoints are not mounted by the MCP server.

  • npm run test:browsers: exercises native React controls, HTTP workflows, cancellation, permission changes, keyboard overlays, RTL and enlarged text in Chromium, Firefox and WebKit.

  • get_component_code retains readable text and adds an output schema and structuredContent. Recipes include stylesheet dependencies, initialization instructions, native React export availability and public event payloads.

  • validate_integration checks selected components, markup, loaded CSS, SVG symbols, target IDs, initialization and declared application handlers together. Warnings about undeclared handlers do not execute or prove callback behavior.

Example MCP integration validation:

{
  "componentIds": ["button"],
  "markup": "<button type=\"button\" class=\"sk-button\">Save</button>",
  "stylesheets": ["sekura.css"],
  "initialization": "auto",
  "handledEvents": ["button:click"]
}

Run npm run test:integration for structured MCP contracts and npm run test:request for HTTP error/abort/timeout handling. Actual screen-reader, OS contrast, physical touch and Figma acceptance procedures are recorded in MANUAL-VALIDATION.md; they have not been performed by a human tester.

Runtime and migration discovery through MCP

  • get_component({ id }) returns the complete specification as text and structured data. sekura://components contains all 71 stable components.

  • get_component_code({ id, framework }) includes CSS dependencies, primary controller, all runtime factories, automatic selectors, manual-only APIs, events and application responsibilities.

  • get_behavior({ id }) accepts a component ID or any public behavior export name. It returns generated TypeScript declarations with supporting types, initialization and cleanup instructions. Omit id for the complete API catalogue; sekura://behaviors exposes the same catalogue as a resource.

  • get_migration_guide({ componentId, fromVersion }) returns the complete canonical plan and source-specific steps. fromVersion accepts 2.x, 3.0.0, 3.0.x, 3.1.0 or 3.1.x; omitting it preserves the complete legacy response. Public-name baselines cover v2.1, v3.0.0 and v3.1.0. The legacy sekura://migration/v2-to-v3 resource remains available alongside sekura://migration/v3.2, sekura://migration/v3.1-to-v3.2 and sekura://migration/v3.0-to-v3.2. Older v3.1 URIs remain aliases.

  • search supports behavior and migration kinds as well as the existing design records.

The build embeds declarations and migration content in dist/data/mcp-reference.json, so stdio and HTTP installations work without source files or the original working directory. Rebuild after changing behavior APIs or migration documentation. npm run test:mcp checks all component specifications, every recipe format, public APIs and resources through an MCP client.

Dependency policy: use the newest supported LTS line when a project offers one (Node 24, Angular 21), otherwise its latest stable release. See the release dependency record for verified versions and source links. Angular packages validate templates, wrapper code and an actual server-render/hydration fixture; a consuming Angular application must use its own supported Angular/TypeScript toolchain. These checks are not a complete ngc application build. The package version is 3.2.1; component maturity does not mean the manual acceptance record is complete.

Available Tools

21 tools
audit_themeAudit every declared contrast pairingA
Read-only

Runs every contrast promise the design system makes against one theme or all four. This is the build gate — run it after any palette change. A pairing that is not declared here is not promised and must not be used to carry meaning.

NameRequiredDescriptionDefault
themeNoOne theme, or omit for all four.
failuresOnlyNoShow only failures (default true when everything passes).

TDQS

A4.2/5.0
Behavior4/5

Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?

Annotations already declare readOnlyHint=true and openWorldHint=false, and the description adds meaningful behavioral context: it is a validation gate over declared contrast promises, and undeclared pairings are not guaranteed. It stops short of describing the exact output/report format, but the build-gate framing makes the pass/fail nature clear.

Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.

Conciseness5/5

Is the description appropriately sized, front-loaded, and free of redundancy?

Three tight sentences with no filler. The core action is front-loaded, followed by when to use it, then the important contract warning. Every sentence earns its place.

Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.

Completeness4/5

Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?

With optional parameters, full schema coverage, and read-only annotations, the definition covers the essential operational context. An explicit description of what the tool returns on success/failure is missing, but 'build gate' and 'failuresOnly' make the expected behavior reasonably inferable.

Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.

Parameters3/5

Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?

Schema description coverage is 100%, so both parameters are already fully documented. The description reinforces the 'one theme or all four' scope but adds no new parameter-level detail, matching the baseline for schema-covered parameters.

Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.

Purpose5/5

Does the description clearly state what the tool does and how it differs from similar tools?

The description uses a specific verb and resource: it runs every contrast promise in the design system against one theme or all four. This clearly differentiates audit_theme from a single-pairing check like check_contrast, leaving no doubt about scope.

Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.

Usage Guidelines4/5

Does the description explain when to use this tool, when not to, or what alternatives exist?

The tool is explicitly positioned as 'the build gate' with a directive to run it after any palette change, giving clear usage context. It does not explicitly name alternatives or when not to use it, but the intended workflow is well communicated.

Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.

check_contrastCheck a colour pair against WCAGA
Read-only

WCAG 2.2 contrast for the rendered foreground/background pair. Supports hex, transparent, modern rgb() and token names. Composites background over an explicit opaque backdrop, or the disclosed theme base when omitted, then foreground over that background.

NameRequiredDescriptionDefault
useNoWhat the pair is for. Drives the threshold: 4.5:1 body, 3:1 large text and UI components.
themeNoTheme to resolve token names in (default light).
backdropNoOpaque hex/CSS colour or token beneath the background. Defaults to the selected theme base, disclosed in the result.
backgroundYesHex/CSS colour, or a token name.
foregroundYesHex value, or a token name like "color-text-primary".

TDQS

A3.8/5.0
Behavior4/5

Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?

Annotations only declare readOnlyHint and openWorldHint; the description adds real behavioral context beyond them, namely the compositing order (background over an explicit opaque backdrop or the theme base, then foreground over that) and acceptance of transparent values. It does not disclose rate limits or the returned pass/fail shape, so it falls short of 5.

Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.

Conciseness5/5

Is the description appropriately sized, front-loaded, and free of redundancy?

Three sentences, front-loaded with the core purpose and standard, followed by supported formats and the compositing rule. No filler, no repetition of the title, and each sentence carries distinct information.

Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.

Completeness4/5

Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?

With annotations covering safety, full schema coverage, and no output schema, the description covers purpose, formats, and compositing adequately. The one gap is that it never says what the call returns (contrast ratio, pass/fail against the threshold) despite no output schema existing to carry that burden.

Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.

Parameters3/5

Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?

Schema coverage is 100%, so all five parameters are already documented, including the enum-driven thresholds and the backdrop default. The description's format list (hex, transparent, rgb(), token names) largely restates the schema, so the baseline 3 is appropriate.

Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.

Purpose4/5

Does the description clearly state what the tool does and how it differs from similar tools?

States a specific verb (check) and resource (contrast of a foreground/background pair) against a named standard, WCAG 2.2, which is far more concrete than the title alone. It never names a sibling, so an agent must infer that audit_theme is the bulk-audit counterpart rather than being told.

Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.

Usage Guidelines3/5

Does the description explain when to use this tool, when not to, or what alternatives exist?

The `use` parameter and the compositing behavior imply the context (checking a single rendered pair rather than auditing a whole theme), but there is no explicit when-to-use/when-not or pointer to audit_theme/suggest_token as alternatives. Usage is inferable rather than stated.

Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.

export_tokensExport tokens in a build formatB
Read-only

Emit tokens in a consumable format. Each format documents its supported scopes, projections and consumer verification obligations; CSS is the complete runtime token artifact.

NameRequiredDescriptionDefault
themeNoOnly for the "json" format, which is single-theme.
formatYescss: CSS custom properties for every theme and density. The canonical runtime artefact — everything else is generated for tooling that cannot consume CSS. | scss: Sass variables plus theme mixins, for pipelines that still compile Sass. | dtcg: DTCG 2025.10 JSON: palette/alpha, four semantic themes, spacing, radius, typography and durations. Fluid typography uses its minimum size with original CSS preserved in extensions; other CSS-only scales are not represented. | tailwind-v4: Tailwind CSS v4 @theme inline block; utilities resolve tokens at the element, including nested theme roots. | tailwind-v3: Tailwind CSS v3 JavaScript config object. | js: Plain ES module exporting a nested token object. | ts: TypeScript module with literal types, so token names are checked at compile time. | swift: UIKit token source: semantic colors (light/dark and increased contrast) and spacing at a 16-point rem baseline. No component or full typography parity; native compilation is consumer-verified. | android: Android resource sections: all semantic colors including alpha, light/dark modes and spacing at a 16-dp rem baseline. Split into the named files. High-contrast modes, components and native compilation are consumer-owned. | figma: Tokens Studio for Figma JSON, with one token set per theme. | json: Flat resolved key/value JSON for one theme. The simplest thing to consume programmatically.

TDQS

B3.4/5.0
Behavior3/5

Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?

Annotations already declare readOnlyHint=true and openWorldHint=false, and the description is consistent with that. It adds genuine context that output varies by format in supported scopes, projections and consumer verification obligations (e.g., native compilation is consumer-owned), but it never states what the call actually returns or whether anything is written to disk despite the word "emit".

Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.

Conciseness4/5

Is the description appropriately sized, front-loaded, and free of redundancy?

Two short sentences, front-loaded with the action and followed by the one useful framing fact about format heterogeneity. The middle clause ("projections and consumer verification obligations") is jargon-heavy but does convey that formats differ in fidelity.

Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.

Completeness3/5

Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?

With no output schema and 11 output formats, the description should say what an export returns (a string, a file set, per-theme artefacts) and whether theme is required or ignored per format. The theme constraint lives only in the schema, leaving a real gap for a tool whose whole purpose is producing differently shaped output.

Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.

Parameters3/5

Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?

Schema description coverage is 100% and the format enum descriptions are unusually rich, so the schema already carries the parameter semantics. The description adds only a framing claim that each format documents its own scope; it contributes no meaning about format values or the theme parameter beyond what the schema states.

Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.

Purpose4/5

Does the description clearly state what the tool does and how it differs from similar tools?

"Emit tokens in a consumable format" gives a specific verb (emit/export) and resource (tokens/design tokens), and the title clarifies it is a build-format export. It does not name the closely related sibling get_tokens or get_stylesheet, so an agent must infer the boundary between raw token retrieval and export.

Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.

Usage Guidelines3/5

Does the description explain when to use this tool, when not to, or what alternatives exist?

Usage is only implied: "CSS is the complete runtime token artifact" and the schema's note that everything else exists "for tooling that cannot consume CSS" suggest css as the default and other formats as targeted alternatives. There is no explicit statement of when to call this instead of get_tokens, nor any prerequisite or selection rule in the description itself.

Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.

get_behaviorGet runtime behavior and lifecycle contractsA
Read-only

Complete public behavior API, including exact TypeScript declarations and supporting types. Filter by component id or exported API name; omit id for the full catalogue. Includes automatic selectors, manual initialization, cleanup, events and application responsibilities.

NameRequiredDescriptionDefault
idNo

Output Schema

NameRequiredDescription
idYes
apiYes
eventsYes
runtimeNo
versionYes
componentsYes
migrationToolYes
schemaVersionYes
initializationYes

TDQS

A3.6/5.0
Behavior3/5

Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?

Annotations already declare readOnlyHint=true and openWorldHint=false, so the safety profile is covered. The description adds useful scope context about what content is included (events, cleanup, responsibilities), but says nothing about response size, pagination, or truncation for what may be a large declaration dump.

Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.

Conciseness4/5

Is the description appropriately sized, front-loaded, and free of redundancy?

Two sentences, front-loaded with what the tool returns before the filtering mechanics. The trailing content enumeration is slightly run-on but every clause adds identifying detail rather than filler.

Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.

Completeness4/5

Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?

An output schema exists, so return values need not be explained, and annotations cover the read-only nature. The description supplies scope and filtering behavior adequately, with the only real gap being lack of differentiation from sibling content tools.

Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.

Parameters4/5

Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?

Schema coverage is 0% and the schema only says id is a non-empty string. The description compensates by explaining that id accepts either a component id or an exported API name, and that omitting it returns the full catalogue — real meaning the schema does not supply.

Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.

Purpose4/5

Does the description clearly state what the tool does and how it differs from similar tools?

States a specific verb+resource ('public behavior API') and enumerates the content it returns (TypeScript declarations, automatic selectors, manual initialization, cleanup, events, application responsibilities). This is concrete and differentiable, but it never names which sibling it should be preferred over (e.g. get_component_code or get_component), leaving the boundary implicit.

Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.

Usage Guidelines3/5

Does the description explain when to use this tool, when not to, or what alternatives exist?

'Filter by component id or exported API name; omit id for the full catalogue' gives clear usage of the id, but there is no when-to-use guidance versus the many sibling tools that also return component material. Usage is implied rather than contrasted with alternatives.

Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.

get_componentGet a component specificationA
Read-only

The complete spec for one component: anatomy, variants, sizes, states, props, tokens consumed, dark-mode behaviour, full accessibility contract (role, keyboard model, ARIA obligations, WCAG criteria, target size), content rules, and do/don't guidance.

NameRequiredDescriptionDefault
idYesComponent id, e.g. "button", "table", "combobox".

Output Schema

NameRequiredDescription
versionYes
componentYes
schemaVersionYes

TDQS

A3.5/5.0
Behavior3/5

Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?

Annotations already declare readOnlyHint=true and openWorldHint=false, so the safety profile is covered by structured data. The description adds useful scope information (a single call is comprehensive across anatomy, a11y, tokens, content rules), telling the agent it need not chain other tools, but it discloses nothing about response shape or pagination.

Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.

Conciseness4/5

Is the description appropriately sized, front-loaded, and free of redundancy?

A single sentence, front-loaded with the one-line purpose before an inventory of covered domains. The enumeration is long but each item signals real returned content; nothing is padded with filler or marketing language.

Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.

Completeness4/5

Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?

With a readOnly annotation set and an output schema present, the description need not explain return values or safety, and it correctly focuses on what a single call covers. The remaining gap is sibling routing among the many get_* tools, which an agent would have to resolve on its own.

Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.

Parameters3/5

Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?

There is a single required 'id' parameter with 100% schema description coverage, including examples ('button', 'table', 'combobox'). The description adds no additional meaning about the id format or lookup behaviour, so the baseline of 3 for schema-carried semantics is appropriate.

Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.

Purpose4/5

Does the description clearly state what the tool does and how it differs from similar tools?

The description states a specific verb and resource ('The complete spec for one component') and enumerates the domains covered (anatomy, variants, accessibility, tokens), so its scope is unambiguous. It falls short of a 5 because it never distinguishes itself from near-neighbours like get_component_code, get_pattern, or get_behavior, which an agent must choose between.

Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.

Usage Guidelines3/5

Does the description explain when to use this tool, when not to, or what alternatives exist?

Usage is implied rather than stated: an agent can infer it should call this when it needs a component's full specification, and the enumerated coverage acts as an implicit trigger. There is no explicit when-to-use, no prerequisites, and no routing to alternatives such as get_component_code for code samples or list_components for discovery.

Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.

get_component_codeGet paste-ready component codeA
Read-only

Production code for a component in the requested framework. HTML returns reference markup with the required ARIA wiring; CSS returns the production stylesheet written against semantic tokens; framework options return editable reference recipes with native markup and lifecycle wiring. Inspect implementation metadata for dependencies and application responsibilities.

NameRequiredDescriptionDefault
idYesComponent id.
frameworkYeshtml: Reference markup. Load sekura.css and the behaviour bundle, then call Sekura.enhance(). | css: Component CSS. Read implementation.cssDependencies for required child styles, or load sekura.css. | react: React TypeScript reference recipe with native markup, unique IDs, editable children and controller cleanup. | vue: Vue reference recipe with native markup, slots and controller cleanup. | svelte: Svelte reference recipe with native markup, snippets and controller cleanup. | angular: Angular standalone reference component with native markup and controller cleanup. | blazor: Blazor reference component. Requires the IIFE bundle and the documented JS lifecycle bridge. | web-component: Light-DOM reference element with native markup and controller cleanup.

Output Schema

NameRequiredDescription
codeYes
versionYes
frameworkYes
componentIdYes
schemaVersionYes
implementationYes
initializationYes
requiredStylesheetsYes

TDQS

A3.7/5.0
Behavior4/5

Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?

Annotations already declare readOnlyHint=true and openWorldHint=false, so safety is covered. The description adds real behavioral context beyond that: which outputs are reference vs production, that framework recipes are editable and include lifecycle wiring, and that implementation metadata should be inspected for dependencies/application responsibilities. It stops short of describing pagination or response shape, but for a read tool this is good added value.

Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.

Conciseness4/5

Is the description appropriately sized, front-loaded, and free of redundancy?

Three sentences, front-loaded with the core return value, then a per-format breakdown, then a follow-up instruction. Little waste, though the format breakdown overlaps with the framework enum descriptions.

Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.

Completeness4/5

Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?

With an output schema present, the description needn't explain return values, yet it gives enough context to choose a framework and understand what each yields. Both required params are documented and the read-only nature is covered. Complete for an agent to invoke correctly; only the sibling-routing guidance is thin.

Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.

Parameters3/5

Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?

Schema description coverage is 100%, including an extensive per-enum description for framework, so the schema carries the parameter burden and baseline is 3. The description's HTML/CSS/framework characterizations largely restate what the enum already documents, adding framing rather than new syntax or constraints.

Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.

Purpose4/5

Does the description clearly state what the tool does and how it differs from similar tools?

The description clearly states the resource and scope: production/reference code for a component, parameterized by framework. It distinguishes the output flavors (HTML reference markup, CSS production stylesheet, framework recipes) so an agent knows what it gets. It does not, however, name or differentiate from the sibling get_component metadata tool, leaving that distinction to inference.

Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.

Usage Guidelines3/5

Does the description explain when to use this tool, when not to, or what alternatives exist?

Usage is only implied: request this when you need paste-ready code for a given framework. There is no explicit when-to-use vs get_component, get_behavior, or get_pattern, and no stated prerequisites or exclusions. The per-framework output notes help an agent understand results but not tool selection.

Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.

get_endpointsWhere the published artefacts liveA
Read-only

Absolute URLs for the stylesheet, token files, behaviours bundle and documentation site served by this instance. Use this instead of assuming paths: the server may be mounted under a path prefix, and only it knows what that prefix is.

NameRequiredDescriptionDefault

No parameters

TDQS

A4.4/5.0
Behavior4/5

Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?

Annotations already declare readOnlyHint=true and openWorldHint=false, so no safety contradiction exists. The description adds meaningful behavioral context beyond annotations: the server may be mounted under a path prefix, and the returned URLs are authoritative for this instance. This helps the agent understand why hardcoding paths is unsafe.

Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.

Conciseness5/5

Is the description appropriately sized, front-loaded, and free of redundancy?

Two sentences with no wasted words. The first sentence front-loads what the tool returns, and the second provides the rationale for using it over assumptions. Every phrase earns its place.

Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.

Completeness4/5

Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?

For a no-parameter, read-only endpoint discovery tool, the description is nearly complete: it lists the artefacts whose URLs are returned, explains why the tool exists, and clarifies the server-authoritative nature. It doesn't specify the exact response shape or keys, but the artefact list gives an agent sufficient expectation of what it will receive.

Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.

Parameters4/5

Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?

The tool has zero parameters and schema coverage is 100% vacuously, so there is no parameter information missing. The description doesn't need to define inputs, and the baseline for zero-parameter tools is 4.

Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.

Purpose5/5

Does the description clearly state what the tool does and how it differs from similar tools?

The description clearly states the tool returns absolute URLs for specific artefacts (stylesheet, token files, behaviours bundle, documentation site), which distinguishes it from siblings that fetch content or tokens. The verb is implicit but the resource scope is concrete and unambiguous.

Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.

Usage Guidelines4/5

Does the description explain when to use this tool, when not to, or what alternatives exist?

The description explicitly says to use this tool instead of assuming paths, and explains why: the server may be mounted under a path prefix that only the server knows. It doesn't name sibling alternatives or give when-not-to-use conditions, but the context is clear enough for an agent to select it over content-fetching tools.

Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.

get_foundationGet a foundation documentA
Read-only

The reasoning behind the system: principles, colour, dark mode, responsive layout, typography, spacing, elevation, motion, accessibility, content and voice, iconography, density, internationalisation, data visualisation, theming. Read the relevant foundation before implementing in that area.

NameRequiredDescriptionDefault
idYesFoundation id.

TDQS

A3.5/5.0
Behavior3/5

Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?

Annotations already declare readOnlyHint=true and openWorldHint=false, so safety is covered. The description adds the workflow framing (read before implementing) but says nothing about the form of the returned content (markdown? length? sections?) or any constraints, so it adds only modest context beyond the annotations.

Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.

Conciseness3/5

Is the description appropriately sized, front-loaded, and free of redundancy?

The opening clause frames the content well, but the long comma-separated enumeration largely duplicates the schema enum and pads the description. The actionable instruction is buried at the end rather than front-loaded.

Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.

Completeness3/5

Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?

For a single-enum-parameter read tool with no output schema, the description conveys the topical scope but not the return shape or size, which is the main thing an agent cannot infer from the schema. Adequate but with a clear gap.

Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.

Parameters3/5

Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?

Schema coverage is 100% and the single enum parameter is fully documented in the schema. The description's topic list essentially restates the enum values rather than adding syntax, defaults, or selection guidance, so the baseline 3 applies.

Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.

Purpose4/5

Does the description clearly state what the tool does and how it differs from similar tools?

The description enumerates the subject matter ('principles, colour, dark mode, ... theming') which makes clear this returns a design-foundation document, and the closing sentence confirms the read-for-guidance intent. However, it never states the verb directly ('retrieves/returns the foundation doc for the given id') and does not differentiate itself from siblings like get_overview or get_primitives.

Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.

Usage Guidelines4/5

Does the description explain when to use this tool, when not to, or what alternatives exist?

'Read the relevant foundation before implementing in that area' gives a clear triggering condition tied to the implementation workflow. It stops short of naming alternatives or when-not-to-use cases (e.g. vs. get_overview or get_tokens), so it is context without routing.

Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.

get_layoutGet a page layout recipeA
Read-only

A complete page blueprint: regions, responsive strategy, accessibility obligations, dark-mode notes, and paste-ready markup plus CSS. All recipes are flex-first and most contain no media query.

NameRequiredDescriptionDefault
idYesLayout id.

TDQS

A4/5.0
Behavior4/5

Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?

Annotations already mark the tool read-only and closed-world; the description adds useful behavioral context beyond that: returned recipes are flex-first, mostly avoid media queries, include accessibility and dark-mode obligations, and are paste-ready. No contradiction with annotations.

Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.

Conciseness5/5

Is the description appropriately sized, front-loaded, and free of redundancy?

Two tight sentences: the first is front-loaded with what the tool returns, the second adds a useful style qualifier. Every word contributes, and there is no redundant restatement of the schema.

Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.

Completeness4/5

Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?

For a read-only, one-parameter tool with an enum and no output schema, the description adequately covers the output contents and general style of the result. It does not describe the response envelope, but the simplicity of the input and annotations make this a minor gap.

Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.

Parameters3/5

Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?

The schema covers 100% of parameters, with the single id parameter fully described and an enum of valid layout ids. The description adds nothing about parameter selection, so the schema carries the burden as expected.

Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.

Purpose5/5

Does the description clearly state what the tool does and how it differs from similar tools?

The description specifies a concrete deliverable – 'a complete page blueprint' – and enumerates its contents: regions, responsive strategy, accessibility obligations, dark-mode notes, and paste-ready markup plus CSS. This clearly identifies a full-layout resource and sets it apart from component/foundation-level sibling tools.

Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.

Usage Guidelines3/5

Does the description explain when to use this tool, when not to, or what alternatives exist?

The 'complete page blueprint' phrasing implies this is the tool for whole-page layouts, and the flex-first note hints at general usage context. However, it never names alternatives like get_component or get_foundation nor says when not to use this tool, so guidance remains implied rather than explicit.

Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.

get_migration_guideGet migration plan and behavior changesA
Read-only

Upgrade to the current release from v2 or v3.0: full canonical plan, source-specific steps, rollout/rollback guidance, behavior changes, compatibility baseline and optional legacy geometry CSS. componentId filters behavior changes; fromVersion selects the upgrade source while preserving the complete guide.

NameRequiredDescriptionDefault
componentIdNo
fromVersionNo

Output Schema

NameRequiredDescription
changesYes
versionYes
markdownYes
componentIdYes
fromVersionYes
upgradePathsNo
compatibilityYes
schemaVersionYes

TDQS

A3.8/5.0
Behavior4/5

Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?

Annotations already establish readOnlyHint=true and openWorldHint=false, so the safety profile is covered. The description adds genuine value beyond that by disclosing what the guide contains (canonical plan, source-specific steps, rollout/rollback, compatibility baseline, optional legacy geometry CSS), giving the agent a clear picture of the read-only output it will get.

Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.

Conciseness4/5

Is the description appropriately sized, front-loaded, and free of redundancy?

Two dense sentences, front-loaded with the upgrade scenario and output inventory before addressing parameters. The content list is long but each item is informative and earns its place; minor compression is possible.

Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.

Completeness4/5

Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?

With an output schema present, the description need not explain return values, yet it helpfully summarizes the guide's contents. Both parameters are addressed and the read-only nature is covered by annotations. Complete enough for correct invocation; only explicit alternative-tool routing is missing.

Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.

Parameters4/5

Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?

Schema description coverage is 0%, so the description must carry the parameter meaning and it largely does: componentId 'filters behavior changes' and fromVersion 'selects the upgrade source while preserving the complete guide'. This clarifies the scope of each parameter's effect, though it could note format/syntax beyond the enum values already in the schema.

Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.

Purpose4/5

Does the description clearly state what the tool does and how it differs from similar tools?

The description names a specific verb and resource — it produces a migration/upgrade plan — and enumerates the concrete contents (source-specific steps, rollout/rollback, behavior changes, compatibility baseline). It does not explicitly differentiate itself from the sibling get_behavior, which overlaps on 'behavior changes', so it stops short of a 5.

Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.

Usage Guidelines3/5

Does the description explain when to use this tool, when not to, or what alternatives exist?

Usage context is implied by 'Upgrade to the current release from v2 or v3.0', which tells the agent the scenario in which to reach for it. However, there is no explicit when-to-use vs alternative, no mention of when this is the wrong tool versus get_behavior, and no prerequisites.

Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.

get_overviewOverview of the design systemA
Read-only

Start here. Returns the map of everything available: foundations, component catalogue, layout recipes, UX patterns, token groups and export formats, with the tool call needed to retrieve each.

NameRequiredDescriptionDefault

No parameters

TDQS

A4.3/5.0
Behavior3/5

Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?

Annotations already declare readOnlyHint=true, so the read-only nature is covered. The description adds no additional behavioral context such as rate limits or side effects, but is consistent with the annotation. With annotations present, the bar is lower and this meets the baseline.

Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.

Conciseness5/5

Is the description appropriately sized, front-loaded, and free of redundancy?

One efficient sentence, front-loaded with 'Start here', and lists the contents in a compact way. Every word earns its place.

Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.

Completeness5/5

Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?

For a zero-parameter overview tool, the description fully explains what is returned (map with categories and tool calls) and is sufficient for an agent to understand its role without an output schema.

Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.

Parameters4/5

Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?

The tool takes no parameters, so parameter explanation is unnecessary. Per rubric, 0 parameters yields a baseline of 4.

Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.

Purpose5/5

Does the description clearly state what the tool does and how it differs from similar tools?

The description clearly states the tool returns a map of all available design system resources and includes the tool call for each. It distinguishes itself from specific siblings like get_foundation or list_components.

Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.

Usage Guidelines4/5

Does the description explain when to use this tool, when not to, or what alternatives exist?

The phrase 'Start here' gives clear directive to use this tool first, but it does not explicitly name alternatives or state exclusions. The context is sufficient for a starting point, though not as explicit as naming alternative tools.

Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.

get_patternGet a UX patternB
Read-only

A recurring UX problem and the Sekura answer: the problem, the solution, the rules, the accessibility obligations, and the anti-patterns to avoid.

NameRequiredDescriptionDefault
idYesPattern id.

TDQS

B3.2/5.0
Behavior3/5

Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?

Annotations already declare readOnlyHint=true and openWorldHint=false, so the safety profile is covered. The description adds genuine value by enumerating what the response contains (problem, solution, rules, accessibility obligations, anti-patterns), but it says nothing about invalid ids, error behavior, or whether the pattern set is closed (the enum implies it is, yet this is not stated).

Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.

Conciseness4/5

Is the description appropriately sized, front-loaded, and free of redundancy?

One sentence, no filler, and the payload contents are front-loaded in a scannable list. It loses a point for spending its only clause on return contents rather than leading with the verb and purpose.

Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.

Completeness3/5

Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?

With no output schema, the description does the right thing by describing the returned sections, which is enough for an agent to know what it gets back. However, for a single-lookup tool in a large sibling set, it omits when to prefer it over get_behavior/get_foundation and omits any failure-mode context.

Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.

Parameters3/5

Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?

Schema coverage is 100% with a single enum-constrained 'id' parameter, so the schema already carries the semantics; baseline 3 applies. The description adds no information about valid ids, case sensitivity, or what happens for an id outside the enum.

Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.

Purpose4/5

Does the description clearly state what the tool does and how it differs from similar tools?

The description clearly conveys the resource: a UX pattern record containing problem, solution, rules, accessibility obligations and anti-patterns. It is not a tautology of the name, but it uses a noun phrase with no verb ('retrieve/return') and never distinguishes this from siblings such as get_behavior or get_foundation, so an agent gets no explicit routing signal.

Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.

Usage Guidelines2/5

Does the description explain when to use this tool, when not to, or what alternatives exist?

There is no statement of when to call this versus get_behavior, get_foundation, or search, and no prerequisites or exclusions. The only implicit hint is the word 'Sekura', which suggests a design-system reference lookup, but the agent must infer that.

Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.

get_primitivesGet primitive colour rampsA
Read-only

The raw colour ramps behind the semantic layer. Use these to build new semantic tokens or to re-brand. Never reference a primitive from product code — it does not change between themes, so it will not adapt to dark mode.

NameRequiredDescriptionDefault
rampNoRamp name: neutral, cobalt, aqua, jade, amber, crimson, azure, violet.

TDQS

A4.2/5.0
Behavior4/5

Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?

Beyond the readOnlyHint annotation, the description adds meaningful behavioral context: primitives do not change between themes and therefore will not adapt to dark mode. This explains a key limitation of the data returned and helps the agent understand why these values should not be used directly in product code.

Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.

Conciseness5/5

Is the description appropriately sized, front-loaded, and free of redundancy?

Three short, purposeful sentences: the first defines what the tool returns, the second states when to use it, and the third warns against misuse. There is no redundancy or filler, and the most important information is front-loaded.

Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.

Completeness4/5

Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?

For a simple tool with one optional parameter and no output schema, the description covers purpose, usage, and a critical constraint. It does not explicitly state what happens if the optional ramp parameter is omitted, but the schema's description of the parameter and the overall simplicity of the tool make this a minor gap rather than a significant omission.

Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.

Parameters3/5

Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?

Schema coverage is 100% for the single optional 'ramp' parameter, and the schema already lists the valid ramp names. The description does not add additional parameter-level detail, but it doesn't need to because the schema fully documents the parameter. This matches the baseline for high schema coverage.

Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.

Purpose5/5

Does the description clearly state what the tool does and how it differs from similar tools?

The description uses a specific verb and resource: it returns 'raw colour ramps behind the semantic layer'. It clearly differentiates this from semantic-token tools by explaining that primitives are the underlying layer used to build semantic tokens, which distinguishes it from siblings like get_tokens and get_foundation.

Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.

Usage Guidelines4/5

Does the description explain when to use this tool, when not to, or what alternatives exist?

The description gives explicit use cases: 'Use these to build new semantic tokens or to re-brand.' It also gives a strong when-not-to-use rule: never reference a primitive from product code because it won't adapt to dark mode. It does not name an alternative tool explicitly, but the context is clear enough to guide selection.

Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.

get_setupGet the project setupA
Read-only

Everything needed to start: the HTML scaffold, the pre-paint theme script (which must be inline and synchronous, or you get a flash of the wrong theme), the reset, the utility layer, the prose styles, and the theme control markup.

NameRequiredDescriptionDefault
partNoWhich part to return (default all).

TDQS

A4/5.0
Behavior4/5

Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?

The description adds a concrete behavioral constraint beyond the readOnly/openWorld annotations: the pre-paint theme script must be inline and synchronous or the page shows a flash of the wrong theme. This is actionable knowledge an agent would otherwise not have. There is no contradiction with the annotations.

Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.

Conciseness4/5

Is the description appropriately sized, front-loaded, and free of redundancy?

One sentence, front-loaded with the overall purpose, then a tightly packed list of contents. The parenthetical warning is dense but relevant and earns its place. No repetition or filler; it could be split for readability, but it is appropriately compact for the information it carries.

Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.

Completeness4/5

Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?

With one optional enum parameter and no output schema, the description conveys both what is returned and a key integration constraint. It doesn't describe the exact return format or how the parts are delimited, which would be helpful, but for a simple get-setup tool this is sufficient. The main gap is no output-structure hints, and that gap is minor because the contents list already sets expectations.

Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.

Parameters4/5

Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?

The schema describes `part` 100% with enum and a default note, so the baseline is 3. The description adds value by mapping enum values to friendlier terms (utility layer → utilities, theme control markup → theme-control, pre-paint theme script → theme-script), which helps an agent understand the semantic intent of each part. It doesn't explain the `all` default, but the schema already covers that.

Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.

Purpose4/5

Does the description clearly state what the tool does and how it differs from similar tools?

The description defines a specific bundle: HTML scaffold, pre-paint theme script, reset, utility layer, prose styles, theme-control markup, framed as 'Everything needed to start'. This clearly distinguishes it from more targeted sibling geters like get_layout or get_tokens, though it doesn't mention any sibling by name. The verb is supplied by the tool name/title, but the resource and scope are unambiguous.

Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.

Usage Guidelines4/5

Does the description explain when to use this tool, when not to, or what alternatives exist?

'Everything needed to start' gives clear situational context: call this tool when bootstrapping a project with the full setup. It doesn't name alternatives or state exclusions, so it stops short of a 5, but it still tells the agent when this tool is the right choice better than a purely generic description would.

Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.

get_stylesheetGet the complete stylesheetA
Read-only

The entire Sekura stylesheet as one file: tokens for all four themes and three densities, reset, prose, utilities, and every component. This is the single artefact needed to render any Sekura interface.

NameRequiredDescriptionDefault
includeNoLayers to include (default all).

TDQS

A4.2/5.0
Behavior4/5

Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?

Annotations already signal read-only and closed-world behavior, so the description does not need safety disclosures. It adds value by describing the all-in-one-file behavior and the exact layers returned, going beyond the annotations.

Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.

Conciseness5/5

Is the description appropriately sized, front-loaded, and free of redundancy?

Two sentences, no filler, with the central purpose and content scope front-loaded. Every sentence earns its place.

Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.

Completeness4/5

Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?

One optional parameter, fully schema-documented, and no output schema, so the description's enumeration of returned layers is sufficient context for an agent. It could mention the include filter explicitly, but that is already in the schema.

Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.

Parameters3/5

Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?

Schema coverage is 100%, with the include parameter, its enum values, and default-all behavior all documented. The description does not need to repeat this, but it also adds no extra parameter meaning.

Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.

Purpose5/5

Does the description clearly state what the tool does and how it differs from similar tools?

States a specific verb (get) and resource (stylesheet), then spells out exact contents: tokens for four themes and three densities, reset, prose, utilities, and every component. This clearly distinguishes it from sibling tools like get_tokens or get_component.

Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.

Usage Guidelines4/5

Does the description explain when to use this tool, when not to, or what alternatives exist?

Explicitly frames the tool as 'the single artefact needed to render any Sekura interface,' giving a clear condition for use. It does not name when-not alternatives, but the resource scope makes the intended usage strong.

Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.

get_tokensGet token valuesA
Read-only

Resolved token values. Filter by group, by name fragment, or return everything. Shows the value in every theme so dark-mode differences are visible side by side.

NameRequiredDescriptionDefault
groupNoToken group: surface, text, border, focus, action, status, form, chart, ai.
themeNoShow only this theme. Omit to show all four.
filterNoSubstring match on token name, e.g. "border", "action-primary".
includeScalesNoInclude non-colour scales (spacing, radius, motion, z-index, typography).

TDQS

A4.2/5.0
Behavior4/5

Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?

Annotations already declare readOnlyHint=true, and the description builds on that by disclosing the resolved-value nature, the multi-theme output behavior, and the all-or-filtered scope. It doesn't contradict the annotations or claim side effects; the only minor gap is not stating output shape or limits, but the read-only and closed-world hints lower the burden.

Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.

Conciseness5/5

Is the description appropriately sized, front-loaded, and free of redundancy?

The main statement is front-loaded in one short sentence, followed by a compact summary of filters and output behavior. Every sentence earns its place, and no schema information is redundantly repeated.

Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.

Completeness4/5

Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?

Given four optional parameters with full schema descriptions, read-only annotations, and no output schema, the description covers the core behavioral expectations: what is returned, how filtering works, and the all-themes default. It could be slightly more explicit about when to choose this over sibling tools, but nothing needed to invoke it correctly is missing.

Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.

Parameters3/5

Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?

Schema description coverage is 100%, so the schema already explains group, theme, filter, and includeScales. The description adds only a compact restatement ('filter by group, by name fragment, or return everything') and the default all-themes behavior, which is useful but not needed to understand the parameters.

Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.

Purpose5/5

Does the description clearly state what the tool does and how it differs from similar tools?

The description names a specific resource ('resolved token values') and a clear action (return them), then distinguishes the tool's breadth: filters by group or name fragment, or returns everything. It also adds the cross-theme viewing behavior, which separates it from related tools like get_primitives or export_tokens without needing to open schema.

Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.

Usage Guidelines4/5

Does the description explain when to use this tool, when not to, or what alternatives exist?

The description effectively gives usage context: use this for resolved tokens, optionally scoped by group, theme, or name fragment, and compare theme values side by side. It doesn't name sibling alternatives or give when-not conditions, but the intended invocation context is clear from the filtering options and 'resolved' wording.

Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.

list_componentsList componentsB
Read-only

The component catalogue, optionally filtered by category or status.

NameRequiredDescriptionDefault
statusNoFilter by maturity.
categoryNoFilter by category.

TDQS

B3.4/5.0
Behavior3/5

Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?

Annotations already declare readOnlyHint=true and openWorldHint=false, so the read-only, closed-world nature is covered. The description adds that this is a complete catalogue with optional filters, but does not disclose ordering, pagination, or default inclusion of deprecated items. This is adequate given the annotation coverage, but not rich.

Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.

Conciseness5/5

Is the description appropriately sized, front-loaded, and free of redundancy?

The description is one short sentence: 'The component catalogue, optionally filtered by category or status.' It is front-loaded with the core noun phrase, adds the conditional filter clause, and contains no redundant or filler words. Every word earns its place.

Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.

Completeness4/5

Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?

For a simple read-only listing tool with two optional enum parameters and no required fields, the description covers the essential what (component catalogue) and how (optional filters). It does not describe the return shape or pagination, but the tool name and 'catalogue' imply a list, and readOnlyHint covers safety. A bit more detail about what each catalogue entry includes would push it higher.

Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.

Parameters3/5

Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?

Schema description coverage is 100%: both status and category have clear descriptions ('Filter by maturity.' and 'Filter by category.') and enums. The description merely paraphrases the schema with 'filtered by category or status', adding no new semantic meaning, so it stays at the baseline 3.

Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.

Purpose4/5

Does the description clearly state what the tool does and how it differs from similar tools?

The description clearly identifies the resource ('the component catalogue') and implies the listing operation, distinguishing it from single-item siblings like get_component. It does not use an explicit active verb beyond the title, and it does not name a specific sibling alternative, so it stops short of a 5.

Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.

Usage Guidelines2/5

Does the description explain when to use this tool, when not to, or what alternatives exist?

The description offers no guidance on when to use this tool versus search, get_component, or get_layout. 'Optionally filtered by category or status' implies flexibility but not a selection criterion. No alternatives or exclusions are mentioned.

Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.

suggest_tokenFind the right token for an intentA
Read-only

Describe what you are styling in plain words and get the semantic tokens that apply, with resolved values per theme and a note on why that token rather than a neighbour. Use this instead of guessing a token name or reaching for a hex value.

NameRequiredDescriptionDefault
limitNo
intentYese.g. "subtle border on a card", "text for a timestamp", "background for a dropdown menu".

TDQS

A4.2/5.0
Behavior4/5

Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?

Annotations declare the tool is read-only, and the description adds meaningful behavioral detail beyond that: it returns resolved values per theme and explains token selection with reasoning about neighboring tokens. This gives the agent a clear picture of the tool's output without contradicting any annotations.

Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.

Conciseness5/5

Is the description appropriately sized, front-loaded, and free of redundancy?

Two sentences, both substantive: the first explains the tool's function and output, the second gives practical usage guidance. No filler or repetition of the title.

Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.

Completeness4/5

Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?

For a simple, read-only tool with only one required parameter and no output schema, the description covers the key context: how to phrase the input, what kind of results to expect, and when to prefer this tool over guessing. It could be slightly more complete by explicitly noting the optional limit parameter or naming a sibling alternative, but these are minor gaps.

Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.

Parameters3/5

Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?

The description explains the intent parameter semantically ('Describe what you are styling in plain words') and the schema provides useful examples for intent. However, the optional 'limit' parameter is not mentioned in the description and has no schema description, so the semantics of that parameter are left entirely to inference from its name and min/max constraints.

Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.

Purpose5/5

Does the description clearly state what the tool does and how it differs from similar tools?

The description uses a specific verb ('Describe... and get') with a clear resource ('semantic tokens') and states what is returned: resolved values per theme and a rationale comparing to neighboring tokens. This clearly distinguishes the tool from siblings like get_tokens or search, which retrieve tokens rather than recommend them from a natural-language intent.

Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.

Usage Guidelines4/5

Does the description explain when to use this tool, when not to, or what alternatives exist?

The instruction 'Use this instead of guessing a token name or reaching for a hex value' gives clear guidance on when this tool is appropriate. It does not explicitly name alternative sibling tools or state when not to use it, but the intended use case is unambiguous.

Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.

validate_integrationValidate component integrationB
Read-only

Check component markup, stylesheet dependencies, SVG symbols, ID references, initialization and declared application events. Returns structured findings and fixes; does not execute callbacks.

NameRequiredDescriptionDefault
markupYes
svgSymbolsNo
controllersNo
externalIdsNo
stylesheetsYes
componentIdsYes
handledEventsNoApplication handlers in componentId:event format, e.g. button:click. This declares wiring; runtime behavior still needs testing.
initializationYes

Output Schema

NameRequiredDescription
validYes
versionYes
findingsYes
limitationYes
schemaVersionYes
requiredControllersYes
requiredStylesheetsYes

TDQS

B3.4/5.0
Behavior4/5

Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?

Annotations already declare readOnlyHint=true and openWorldHint=false, so the safety profile is covered. The description adds genuinely useful context beyond that: it returns structured findings plus fixes, and explicitly does not execute callbacks — a meaningful side-effect boundary the annotations do not convey.

Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.

Conciseness4/5

Is the description appropriately sized, front-loaded, and free of redundancy?

Two tight sentences with no filler; the validated surface is front-loaded and the behavioral caveat follows. Efficient and well-ordered for its size.

Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.

Completeness3/5

Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?

An output schema exists, so return value detail is not owed by the description, and the read-only nature is covered by annotations. However, the low parameter coverage and absence of any when-to-use/alternative routing leave gaps for an agent deciding whether to call this versus validate_markup.

Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.

Parameters3/5

Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?

Schema description coverage is only 13% across 8 parameters, so the description must compensate. It narratively covers markup, stylesheets, SVG symbols, ID references (externalIds), initialization, and handledEvents, but omits controllers and componentIds and gives no format/syntax detail. Partial compensation justifies a mid score.

Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.

Purpose4/5

Does the description clearly state what the tool does and how it differs from similar tools?

The description states a specific verb (check) and enumerates exactly what is validated: markup, stylesheet dependencies, SVG symbols, ID references, initialization, and declared events. This is far more concrete than the title, though it never explicitly distinguishes itself from the sibling validate_markup beyond the implicit 'integration' scope.

Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.

Usage Guidelines2/5

Does the description explain when to use this tool, when not to, or what alternatives exist?

There is no when-to-use guidance and no mention of the obvious sibling validate_markup, which an agent would need to choose between. The scope (integration-level) is only inferable from the name and the checklist of what it inspects.

Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.

validate_markupLint markup against the specificationA
Read-only

Checks HTML or CSS for the accessibility and design-system failures that actually ship: missing accessible names, unlabelled inputs, hard-coded colours that break in dark mode, flex containers that will overflow, positive tabindex, removed focus outlines, and misused live regions. Advisory — a clean result is not a certificate of accessibility.

NameRequiredDescriptionDefault
markupYesHTML and/or CSS to check; maximum 524288 UTF-16 code units. Parsed structure and accessible-name work are also bounded.
componentIdNoCheck against a specific component spec as well.

TDQS

A3.8/5.0
Behavior4/5

Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?

Annotations already declare readOnlyHint=true and openWorldHint=false, so safety is covered. The description adds genuinely useful context beyond the annotations: the checks are scoped to shipping failures and the result is explicitly advisory, not a certification of accessibility — important for how the agent should phrase findings. It stops short of describing result format or coverage limits.

Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.

Conciseness5/5

Is the description appropriately sized, front-loaded, and free of redundancy?

Front-loaded with the verb and resource, then a tight enumeration of concrete failure types, closed by a one-clause caveat. The long list is informative rather than padding — it defines the check surface with no redundant sentences.

Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.

Completeness4/5

Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?

For a read-only lint tool with fully documented parameters, the description covers purpose, scope, and the crucial advisory semantics. The one gap is the return shape: there is no output schema and the description never indicates what a result contains (findings list? per-check messages?), which the agent would need to present results.

Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.

Parameters3/5

Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?

Schema description coverage is 100%, so both markup (with its size bound) and componentId are already documented in the schema. The description adds nothing about the parameters themselves, so the baseline 3 applies.

Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.

Purpose4/5

Does the description clearly state what the tool does and how it differs from similar tools?

Specific verb ('Checks') plus concrete resource ('HTML or CSS') and an enumerated set of failure classes (accessible names, tabindex, focus outlines, live regions), so the agent knows exactly what linting surface this covers. It does not explicitly distinguish itself from the sibling check_contrast, which overlaps on the colour/dark-mode checks, so it falls short of a 5.

Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.

Usage Guidelines3/5

Does the description explain when to use this tool, when not to, or what alternatives exist?

Usage is implied by the check list ('the failures that actually ship'), but there is no explicit when-to-use statement and no routing to alternatives such as check_contrast for pure contrast questions or get_component for spec lookups. The advisory caveat addresses interpretation of results, not tool selection.

Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.

Tool Schema Changelog

Recent tool additions, removals, and schema changes observed during successful MCP inspections.

  1. 7 tool updatesv3.2.1
    • Changedcheck_contrast2 fields changed
      • addedInput schema / properties / backdrop
        Added value: +{
        +  "description": "Opaque hex/CSS colour or token beneath the background. Defaults to the selected theme base, disclosed in the result.",
        +  "type": "string"
        +}
      • changedInput schema / properties / background / description
        Previous value: -"Hex value, or a token name."New value: +"Hex/CSS colour, or a token name."
    • Changedexport_tokens1 field changed
      • changedInput schema / properties / format / description
        Previous value: -"css: CSS custom properties for every theme and density. The canonical runtime artefact — everything else is generated for tooling that cannot consume CSS. | scss: Sass variables plus theme mixins, for pipelines that still compile Sass. | dtcg: W3C Design Tokens Community Group JSON. The interchange format for design tools and token pipelines. | tailwind-v4: Tailwind CSS v4 @theme block mapping tokens to utility namespaces. | tailwind-v3: Tailwind CSS v3 JavaScript config object. | js: Plain ES module exporting a nested token object. | ts: TypeScript module with literal types, so token names are checked at compile time. | swift: Swift extension with UIColor values resolved per theme, for iOS. | android: Android colors.xml plus dimens.xml, with a values-night variant for dark. | figma: Tokens Studio for Figma JSON, with one token set per theme. | json: Flat resolved key/value JSON for one theme. The simplest thing to consume programmatically."New value: +"css: CSS custom properties for every theme and density. The canonical runtime artefact — everything else is generated for tooling that cannot consume CSS. | scss: Sass variables plus theme mixins, for pipelines that still compile Sass. | dtcg: DTCG 2025.10 JSON: palette/alpha, four semantic themes, spacing, radius, typography and durations. Fluid typography uses its minimum size with original CSS preserved in extensions; other CSS-only scales are not represented. | tailwind-v4: Tailwind CSS v4 @theme inline block; utilities resolve tokens at the element, including nested theme roots. | tailwind-v3: Tailwind CSS v3 JavaScript config object. | js: Plain ES module exporting a nested token object. | ts: TypeScript module with literal types, so token names are checked at compile time. | swift: UIKit token source: semantic colors (light/dark and increased contrast) and spacing at a 16-point rem baseline. No component or full typography parity; native compilation is consumer-verified. | android: Android resource sections: all semantic colors including alpha, light/dark modes and spacing at a 16-dp rem baseline. Split into the named files. High-contrast modes, components and native compilation are consumer-owned. | figma: Tokens Studio for Figma JSON, with one token set per theme. | json: Flat resolved key/value JSON for one theme. The simplest thing to consume programmatically."
    • Changedget_behavior1 field changed
      • addedOutput schema / properties / runtime
        Added value: +{
        +  "anyOf": [
        +    {
        +      "additionalProperties": false,
        +      "properties": {
        +        "autoSelectors": {
        +          "items": {
        +            "type": "string"
        +          },
        +          "type": "array"
        +        },
        +        "capabilities": {
        +          "items": {
        +            "type": "string"
        +          },
        +          "type": "array"
        +        },
        +        "controllers": {
        +          "items": {
        +            "type": "string"
        +          },
        +          "type": "array"
        +        },
        +        "identity": {
        +          "additionalProperties": false,
        +          "properties": {
        +            "attribute": {
        +              "type": "string"
        +            },
        +            "description": {
        +              "type": "string"
        +            },
        +            "requiredFor": {
        +              "type": "string"
        +            }
        +          },
        +          "required": [
        +            "attribute",
        +            "requiredFor",
        +            "description"
        +          ],
        +          "type": "object"
        +        },
        +        "manualOnly": {
        +          "items": {
        +            "type": "string"
        +          },
        +          "type": "array"
        +        },
        +        "notes": {
        +          "items": {
        +            "type": "string"
        +          },
        +          "type": "array"
        +        },
        +        "purposes": {
        +          "items": {
        +            "enum": [
        +              "navigation",
        +              "commands",
        +              "disclosure",
        +              "selection"
        +            ],
        +            "type": "string"
        +          },
        +          "type": "array"
        +        },
        +        "requirements": {
        +          "items": {
        +            "additionalProperties": false,
        +            "properties": {
        +              "autoMarker": {
        +                "type": "string"
        +              },
        +              "controller": {
        +                "type": "string"
        +              },
        +              "description": {
        +                "type": "string"
        +              },
        +              "manualOnly": {
        +                "type": "boolean"
        +              },
        +              "when": {
        +                "additionalProperties": false,
        +                "properties": {
        +                  "attribute": {
        +                    "type": "string"
        +                  },
        +                  "className": {
        +                    "type": "string"
        +                  },
        +                  "value": {
        +                    "type": "string"
        +                  }
        +                },
        +                "type": "object"
        +              }
        +            },
        +            "required": [
        +              "controller",
        +              "when",
        +              "description"
        +            ],
        +            "type": "object"
        +          },
        +          "type": "array"
        +        },
        +        "stateOwnership": {
        +          "additionalProperties": false,
        +          "properties": {
        +            "application": {
        +              "items": {
        +                "type": "string"
        +              },
        +              "type": "array"
        +            },
        +            "controller": {
        +              "items": {
        +                "type": "string"
        +              },
        +              "type": "array"
        +            }
        +          },
        +          "required": [
        +            "controller",
        +            "application"
        +          ],
        +          "type": "object"
        +        }
        +      },
        +      "required": [
        +        "controllers",
        +        "autoSelectors",
        +        "manualOnly",
        +        "notes"
        +      ],
        +      "type": "object"
        +    },
        +    {
        +      "type": "null"
        +    }
        +  ]
        +}
    • Changedget_component_code7 fields changed
      • addedOutput schema / properties / implementation / properties / designKit
        Added value: +{
        +  "type": "boolean"
        +}
      • addedOutput schema / properties / implementation / properties / runtime / properties / capabilities
        Added value: +{
        +  "items": {
        +    "type": "string"
        +  },
        +  "type": "array"
        +}
      • addedOutput schema / properties / implementation / properties / runtime / properties / identity
        Added value: +{
        +  "additionalProperties": false,
        +  "properties": {
        +    "attribute": {
        +      "type": "string"
        +    },
        +    "description": {
        +      "type": "string"
        +    },
        +    "requiredFor": {
        +      "type": "string"
        +    }
        +  },
        +  "required": [
        +    "attribute",
        +    "requiredFor",
        +    "description"
        +  ],
        +  "type": "object"
        +}
      • addedOutput schema / properties / implementation / properties / runtime / properties / purposes
        Added value: +{
        +  "items": {
        +    "enum": [
        +      "navigation",
        +      "commands",
        +      "disclosure",
        +      "selection"
        +    ],
        +    "type": "string"
        +  },
        +  "type": "array"
        +}
      • addedOutput schema / properties / implementation / properties / runtime / properties / requirements
        Added value: +{
        +  "items": {
        +    "additionalProperties": false,
        +    "properties": {
        +      "autoMarker": {
        +        "type": "string"
        +      },
        +      "controller": {
        +        "type": "string"
        +      },
        +      "description": {
        +        "type": "string"
        +      },
        +      "manualOnly": {
        +        "type": "boolean"
        +      },
        +      "when": {
        +        "additionalProperties": false,
        +        "properties": {
        +          "attribute": {
        +            "type": "string"
        +          },
        +          "className": {
        +            "type": "string"
        +          },
        +          "value": {
        +            "type": "string"
        +          }
        +        },
        +        "type": "object"
        +      }
        +    },
        +    "required": [
        +      "controller",
        +      "when",
        +      "description"
        +    ],
        +    "type": "object"
        +  },
        +  "type": "array"
        +}
      • addedOutput schema / properties / implementation / properties / runtime / properties / stateOwnership
        Added value: +{
        +  "additionalProperties": false,
        +  "properties": {
        +    "application": {
        +      "items": {
        +        "type": "string"
        +      },
        +      "type": "array"
        +    },
        +    "controller": {
        +      "items": {
        +        "type": "string"
        +      },
        +      "type": "array"
        +    }
        +  },
        +  "required": [
        +    "controller",
        +    "application"
        +  ],
        +  "type": "object"
        +}
      • changedOutput schema / properties / implementation / required
        Previous value: -[
        -  "runtime",
        -  "rootClass",
        -  "cssDependencies",
        -  "svgSymbols",
        -  "controller",
        -  "behavior",
        -  "frameworkOutput",
        -  "applicationResponsibilities",
        -  "events",
        -  "autoMarker",
        -  "nativeReactExport"
        -]New value: +[
        +  "runtime",
        +  "rootClass",
        +  "cssDependencies",
        +  "svgSymbols",
        +  "controller",
        +  "behavior",
        +  "frameworkOutput",
        +  "applicationResponsibilities",
        +  "events",
        +  "autoMarker",
        +  "nativeReactExport",
        +  "designKit"
        +]
    • Changedget_migration_guide3 fields changed
      • addedInput schema / properties / fromVersion
        Added value: +{
        +  "enum": [
        +    "2.x",
        +    "3.0.0",
        +    "3.0.x",
        +    "3.1.0",
        +    "3.1.x"
        +  ],
        +  "type": "string"
        +}
      • addedOutput schema / properties / changes / items / properties / fromVersions
        Added value: +{
        +  "items": {
        +    "enum": [
        +      "2.x",
        +      "3.0.0",
        +      "3.0.x",
        +      "3.1.0",
        +      "3.1.x"
        +    ],
        +    "type": "string"
        +  },
        +  "type": "array"
        +}
      • addedOutput schema / properties / upgradePaths
        Added value: +{
        +  "items": {
        +    "additionalProperties": false,
        +    "properties": {
        +      "fromVersion": {
        +        "enum": [
        +          "2.x",
        +          "3.0.0",
        +          "3.0.x",
        +          "3.1.0",
        +          "3.1.x"
        +        ],
        +        "type": "string"
        +      },
        +      "steps": {
        +        "items": {
        +          "type": "string"
        +        },
        +        "type": "array"
        +      },
        +      "summary": {
        +        "type": "string"
        +      },
        +      "toVersion": {
        +        "type": "string"
        +      }
        +    },
        +    "required": [
        +      "fromVersion",
        +      "toVersion",
        +      "summary",
        +      "steps"
        +    ],
        +    "type": "object"
        +  },
        +  "type": "array"
        +}
    • Changedget_pattern1 field changed
      • changedInput schema / properties / id / enum
        Previous value: -[
        -  "destructive-confirmation",
        -  "form-validation",
        -  "loading-states",
        -  "search-and-filter",
        -  "bulk-actions",
        -  "saving",
        -  "notifications",
        -  "permissions",
        -  "progressive-disclosure",
        -  "keyboard-shortcuts",
        -  "responsive-tables",
        -  "optimistic-ui",
        -  "onboarding",
        -  "error-recovery",
        -  "theme-switching"
        -]New value: +[
        +  "hierarchical-navigation",
        +  "action-submenus",
        +  "navigation-tree",
        +  "destructive-confirmation",
        +  "editing-and-commit",
        +  "form-validation",
        +  "loading-states",
        +  "search-and-filter",
        +  "bulk-actions",
        +  "saving",
        +  "notifications",
        +  "permissions",
        +  "progressive-disclosure",
        +  "keyboard-shortcuts",
        +  "responsive-tables",
        +  "optimistic-ui",
        +  "onboarding",
        +  "error-recovery",
        +  "theme-switching"
        +]
    • Changedvalidate_markup1 field changed
      • changedInput schema / properties / markup / description
        Previous value: -"HTML and/or CSS to check."New value: +"HTML and/or CSS to check; maximum 524288 UTF-16 code units. Parsed structure and accessible-name work are also bounded."
  2. 7 tool updatesv3.0.0
    • Addedget_behavior
    • Changedget_component1 field changed
      • changedOutput schema / (root)
        Previous value: -nullNew value: +{
        +  "$schema": "http://json-schema.org/draft-07/schema#",
        +  "additionalProperties": false,
        +  "properties": {
        +    "component": {
        +      "additionalProperties": {},
        +      "properties": {
        +        "id": {
        +          "type": "string"
        +        },
        +        "status": {
        +          "type": "string"
        +        }
        +      },
        +      "required": [
        +        "id",
        +        "status"
        +      ],
        +      "type": "object"
        +    },
        +    "schemaVersion": {
        +      "const": 1,
        +      "type": "number"
        +    },
        +    "version": {
        +      "type": "string"
        +    }
        +  },
        +  "required": [
        +    "schemaVersion",
        +    "version",
        +    "component"
        +  ],
        +  "type": "object"
        +}
    • Changedget_component_code2 fields changed
      • addedOutput schema / properties / implementation / properties / runtime
        Added value: +{
        +  "additionalProperties": false,
        +  "properties": {
        +    "autoSelectors": {
        +      "items": {
        +        "type": "string"
        +      },
        +      "type": "array"
        +    },
        +    "controllers": {
        +      "items": {
        +        "type": "string"
        +      },
        +      "type": "array"
        +    },
        +    "manualOnly": {
        +      "items": {
        +        "type": "string"
        +      },
        +      "type": "array"
        +    },
        +    "notes": {
        +      "items": {
        +        "type": "string"
        +      },
        +      "type": "array"
        +    }
        +  },
        +  "required": [
        +    "controllers",
        +    "autoSelectors",
        +    "manualOnly",
        +    "notes"
        +  ],
        +  "type": "object"
        +}
      • changedOutput schema / properties / implementation / required
        Previous value: -[
        -  "rootClass",
        -  "cssDependencies",
        -  "svgSymbols",
        -  "controller",
        -  "behavior",
        -  "frameworkOutput",
        -  "applicationResponsibilities",
        -  "events",
        -  "autoMarker",
        -  "nativeReactExport"
        -]New value: +[
        +  "runtime",
        +  "rootClass",
        +  "cssDependencies",
        +  "svgSymbols",
        +  "controller",
        +  "behavior",
        +  "frameworkOutput",
        +  "applicationResponsibilities",
        +  "events",
        +  "autoMarker",
        +  "nativeReactExport"
        +]
    • Changedget_foundation1 field changed
      • changedInput schema / properties / id / enum
        Previous value: -[
        -  "principles",
        -  "color",
        -  "dark-mode",
        -  "responsive-layout",
        -  "typography",
        -  "spacing",
        -  "elevation",
        -  "motion",
        -  "accessibility",
        -  "content-and-voice",
        -  "iconography",
        -  "density",
        -  "internationalisation",
        -  "data-visualisation",
        -  "theming"
        -]New value: +[
        +  "workspace-design",
        +  "principles",
        +  "color",
        +  "dark-mode",
        +  "responsive-layout",
        +  "typography",
        +  "spacing",
        +  "elevation",
        +  "motion",
        +  "accessibility",
        +  "content-and-voice",
        +  "iconography",
        +  "density",
        +  "internationalisation",
        +  "data-visualisation",
        +  "theming"
        +]
    • Addedget_migration_guide
    • Changedsearch1 field changed
      • changedInput schema / properties / kinds / items / enum
        Previous value: -[
        -  "component",
        -  "foundation",
        -  "pattern",
        -  "layout",
        -  "token"
        -]New value: +[
        +  "component",
        +  "foundation",
        +  "pattern",
        +  "layout",
        +  "token",
        +  "behavior",
        +  "migration"
        +]
    • Changedvalidate_integration1 field changed
      • changedInput schema / properties / componentIds / maxItems
        Previous value: -67New value: +71
  3. 18 tool updatesv2.1.0
    • Changedaudit_theme1 field changed
      • removedInput schema / additionalProperties
        Removed value: -false
    • Changedcheck_contrast1 field changed
      • removedInput schema / additionalProperties
        Removed value: -false
    • Changedexport_tokens1 field changed
      • removedInput schema / additionalProperties
        Removed value: -false
    • Changedget_component1 field changed
      • removedInput schema / additionalProperties
        Removed value: -false
    • Changedget_component_code3 fields changed
      • removedInput schema / additionalProperties
        Removed value: -false
      • changedInput schema / properties / framework / description
        Previous value: -"html: Reference markup with the required ARIA wiring in place. | css: The production stylesheet for this component, written against semantic tokens. | react: TypeScript React component with forwardRef and typed variant props. | vue: Vue 3 single-file component using the composition API. | svelte: Svelte 5 component using runes. | angular: Angular standalone component. | blazor: Blazor Razor component with typed parameters. | web-component: Framework-free custom element wrapping the same classes."New value: +"html: Reference markup. Load sekura.css and the behaviour bundle, then call Sekura.enhance(). | css: Component CSS. Read implementation.cssDependencies for required child styles, or load sekura.css. | react: React TypeScript reference recipe with native markup, unique IDs, editable children and controller cleanup. | vue: Vue reference recipe with native markup, slots and controller cleanup. | svelte: Svelte reference recipe with native markup, snippets and controller cleanup. | angular: Angular standalone reference component with native markup and controller cleanup. | blazor: Blazor reference component. Requires the IIFE bundle and the documented JS lifecycle bridge. | web-component: Light-DOM reference element with native markup and controller cleanup."
      • changedOutput schema / (root)
        Previous value: -nullNew value: +{
        +  "$schema": "http://json-schema.org/draft-07/schema#",
        +  "additionalProperties": false,
        +  "properties": {
        +    "code": {
        +      "type": "string"
        +    },
        +    "componentId": {
        +      "type": "string"
        +    },
        +    "framework": {
        +      "enum": [
        +        "html",
        +        "css",
        +        "react",
        +        "vue",
        +        "svelte",
        +        "angular",
        +        "blazor",
        +        "web-component"
        +      ],
        +      "type": "string"
        +    },
        +    "implementation": {
        +      "additionalProperties": false,
        +      "properties": {
        +        "applicationResponsibilities": {
        +          "items": {
        +            "type": "string"
        +          },
        +          "type": "array"
        +        },
        +        "autoMarker": {
        +          "type": [
        +            "string",
        +            "null"
        +          ]
        +        },
        +        "behavior": {
        +          "enum": [
        +            "native",
        +            "controller",
        +            "application"
        +          ],
        +          "type": "string"
        +        },
        +        "controller": {
        +          "type": [
        +            "string",
        +            "null"
        +          ]
        +        },
        +        "cssDependencies": {
        +          "items": {
        +            "type": "string"
        +          },
        +          "type": "array"
        +        },
        +        "events": {
        +          "items": {
        +            "additionalProperties": false,
        +            "properties": {
        +              "applicationRequired": {
        +                "type": "boolean"
        +              },
        +              "detail": {
        +                "additionalProperties": {
        +                  "type": "string"
        +                },
        +                "propertyNames": {
        +                  "type": "string"
        +                },
        +                "type": "object"
        +              },
        +              "name": {
        +                "type": "string"
        +              },
        +              "source": {
        +                "enum": [
        +                  "native",
        +                  "controller"
        +                ],
        +                "type": "string"
        +              }
        +            },
        +            "required": [
        +              "name",
        +              "detail",
        +              "source",
        +              "applicationRequired"
        +            ],
        +            "type": "object"
        +          },
        +          "type": "array"
        +        },
        +        "frameworkOutput": {
        +          "const": "reference-recipe",
        +          "type": "string"
        +        },
        +        "nativeReactExport": {
        +          "type": [
        +            "string",
        +            "null"
        +          ]
        +        },
        +        "rootClass": {
        +          "type": "string"
        +        },
        +        "svgSymbols": {
        +          "items": {
        +            "type": "string"
        +          },
        +          "type": "array"
        +        }
        +      },
        +      "required": [
        +        "rootClass",
        +        "cssDependencies",
        +        "svgSymbols",
        +        "controller",
        +        "behavior",
        +        "frameworkOutput",
        +        "applicationResponsibilities",
        +        "events",
        +        "autoMarker",
        +        "nativeReactExport"
        +      ],
        +      "type": "object"
        +    },
        +    "initialization": {
        +      "type": "string"
        +    },
        +    "requiredStylesheets": {
        +      "items": {
        +        "type": "string"
        +      },
        +      "type": "array"
        +    },
        +    "schemaVersion": {
        +      "const": 1,
        +      "type": "number"
        +    },
        +    "version": {
        +      "type": "string"
        +    }
        +  },
        +  "required": [
        +    "schemaVersion",
        +    "version",
        +    "componentId",
        +    "framework",
        +    "code",
        +    "implementation",
        +    "requiredStylesheets",
        +    "initialization"
        +  ],
        +  "type": "object"
        +}
    • Addedget_endpoints
    • Changedget_foundation1 field changed
      • removedInput schema / additionalProperties
        Removed value: -false
    • Changedget_layout1 field changed
      • removedInput schema / additionalProperties
        Removed value: -false
    • Changedget_pattern1 field changed
      • removedInput schema / additionalProperties
        Removed value: -false
    • Changedget_primitives1 field changed
      • removedInput schema / additionalProperties
        Removed value: -false
    • Changedget_setup1 field changed
      • removedInput schema / additionalProperties
        Removed value: -false
    • Changedget_stylesheet1 field changed
      • removedInput schema / additionalProperties
        Removed value: -false
    • Changedget_tokens1 field changed
      • removedInput schema / additionalProperties
        Removed value: -false
    • Changedlist_components1 field changed
      • removedInput schema / additionalProperties
        Removed value: -false
    • Changedsearch1 field changed
      • removedInput schema / additionalProperties
        Removed value: -false
    • Changedsuggest_token1 field changed
      • removedInput schema / additionalProperties
        Removed value: -false
    • Addedvalidate_integration
    • Changedvalidate_markup1 field changed
      • removedInput schema / additionalProperties
        Removed value: -false
  4. 17 tool updatesv1.0.0
    • First observedaudit_theme
    • First observedcheck_contrast
    • First observedexport_tokens
    • First observedget_component
    • First observedget_component_code
    • First observedget_foundation
    • First observedget_layout
    • First observedget_overview
    • First observedget_pattern
    • First observedget_primitives
    • First observedget_setup
    • First observedget_stylesheet
    • First observedget_tokens
    • First observedlist_components
    • First observedsearch
    • First observedsuggest_token
    • First observedvalidate_markup

TDQS

A3.8/5.0

Scored across 21 tools

Disambiguation4/5

Most tools have clearly distinct targets (catalogue vs single component vs code vs behaviour vs migration). A few clusters need the descriptions to disambiguate: get_tokens/export_tokens/get_primitives/suggest_token all touch tokens, and validate_markup vs validate_integration overlap on validation. The descriptions do a good job of explaining when to use each, so misselection is unlikely but possible.

Naming Consistency5/5

Names uniformly follow a snake_case verb_noun pattern (get_component, list_components, validate_markup, export_tokens, audit_theme, suggest_token, check_contrast). The only mild outlier is the bare 'search', which is idiomatic and unambiguous. No mixing of casing or style conventions.

Tool Count4/5

21 tools is on the heavy side but maps to a genuinely broad domain: discovery, components, foundations, tokens, code, patterns, layouts, validation, migration and setup. Each tool earns a distinguishable place, though a few token-related ones could conceivably be consolidated.

Completeness4/5

Coverage is strong for a read-only design-system surface: overview/discovery, component catalogue and specs, foundations, tokens, code and layout generation, contrast/theme/markup/integration validation, migration and endpoint discovery. Minor gaps like a changelog or version-history tool exist, but core agent workflows have no dead ends.

Maintenance

ActivityActive
ResponsivenessNo issues

Related MCP Connectors

Related MCP Servers

  • A
    license
    Not graded
    quality
    B
    maintenance
    A read-only MCP server that provides AI coding agents with a queryable contract for design system tokens, components, patterns, and anti-patterns.
    9 npm
    1
    Apache 2.0
  • A
    license
    A
    quality
    A
    maintenance
    Read-only MCP server that exposes a design system's tokens, components, conventions, and deprecations as queryable tools, enabling agents to look up canonical values, assess change impact, and detect hardcoded value drift.
    8
    2 npm
    MIT
  • A
    license
    Not graded
    quality
    A
    maintenance
    Enables coding agents to access a governed, versioned design style specification through MCP, including deterministic checks, proposal review workflows, and generated CSS, JSON, and TypeScript artifacts.
    Apache 2.0