check_code

Echo's check on a piece of code you've written or are about to write: colours, spacing, radii, shadows and timing off Echo's scales, raw elements where Echo has the component, props a component doesn't take, controls without a name, markup a keyboard or screen reader can't use, restyling Echo from outside, and the screen rules one file can show. The same rules as `npx echo-ui-cli check`, which runs on a whole project with its own theme; this one uses the default theme. Each finding says the Echo way to fix it.

read-only

Argument	Type	Description
code*	string	The file's contents: TSX, JSX or CSS, up to 200,000 characters.
file	string	Its file name, e.g. "app/settings/page.tsx" or "styles.css", which says what it is. TSX when left out.

Input schema (JSON)

{
  "type": "object",
  "$schema": "http://json-schema.org/draft-07/schema#",
  "required": [
    "code"
  ],
  "properties": {
    "code": {
      "type": "string",
      "maxLength": 200000,
      "description": "The file's contents: TSX, JSX or CSS, up to 200,000 characters."
    },
    "file": {
      "type": "string",
      "description": "Its file name, e.g. \"app/settings/page.tsx\" or \"styles.css\", which says what it is. TSX when left out."
    }
  }
}

check_style

Whether a style.json is one Echo can apply, as `npx echo-ui-cli style check` says it: what stops it, the device it makes (light or dark), what the theme corrects for AA contrast, what the slop police stops (with the question for the builder) or the builder kept, and the decisions it leaves open.

read-only

Argument	Type	Description
style*	object	The style.json's contents, as a JSON object.

Input schema (JSON)

{
  "type": "object",
  "$schema": "http://json-schema.org/draft-07/schema#",
  "required": [
    "style"
  ],
  "properties": {
    "style": {
      "type": "object",
      "description": "The style.json's contents, as a JSON object.",
      "propertyNames": {
        "type": "string"
      },
      "additionalProperties": {}
    }
  }
}

fit_styles

Style Fit's shortlist: Echo's styles, and the builder's own passed in, measured against where a product sits on the seven axes (warmth, volume, density, formality, era, craft, ornament) and put in order: a style that misses a locked axis last, then least past tolerance first, then nearest. The same arithmetic as `npx echo-ui-cli style fit`. It orders; it doesn't pick.

read-only

Argument	Type	Description
yours	array	The builder's own styles, from their library or this conversation.
profile*	string	Where the product sits, 1 to 5 on each axis: "W4 V2 D1 F2 E3 C3 O3".
tolerance	string	How far a style may drift on each axis, 0 (locked) to 4: "W1 V1 D1 F0 E2 C1 O1". Left out, every axis may drift a point.

Input schema (JSON)

{
  "type": "object",
  "$schema": "http://json-schema.org/draft-07/schema#",
  "required": [
    "profile"
  ],
  "properties": {
    "yours": {
      "type": "array",
      "items": {
        "type": "object",
        "required": [
          "name",
          "fingerprint"
        ],
        "properties": {
          "name": {
            "type": "string",
            "description": "The style's name, as its folder is called."
          },
          "essence": {
            "type": "string",
            "description": "Its one line."
          },
          "fingerprint": {
            "type": "string",
            "description": "Its fingerprint, as its style.json or the library's INDEX.md gives it: \"W3 V2 D3 F3 E2 C4 O2\"."
          }
        }
      },
      "maxItems": 50,
      "description": "The builder's own styles, from their library or this conversation."
    },
    "profile": {
      "type": "string",
      "description": "Where the product sits, 1 to 5 on each axis: \"W4 V2 D1 F2 E3 C3 O3\"."
    },
    "tolerance": {
      "type": "string",
      "description": "How far a style may drift on each axis, 0 (locked) to 4: \"W1 V1 D1 F0 E2 C1 O1\". Left out, every axis may drift a point."
    }
  }
}

get_accessibility

The accessibility rules a consumer of Echo can still get wrong — names on controls, form errors, announcements, focus and target size — and, with a name, what that component's accessibility was actually tested against. Echo guarantees WCAG 2.2 AA; this is the part the guarantee cannot cover for you. It's for before building a form, a dialog or anything icon-only.

read-only

Argument	Type	Description
name	string	A component, for its own tested/untested record. Omit for the rules that apply everywhere.

Input schema (JSON)

{
  "type": "object",
  "$schema": "http://json-schema.org/draft-07/schema#",
  "properties": {
    "name": {
      "type": "string",
      "description": "A component, for its own tested/untested record. Omit for the rules that apply everywhere."
    }
  }
}

get_component

The full record for one component: description, install command, usage (imports + smallest working snippet), composition (part tree), examples, accessibility, motion & sound, prop table and anti-patterns. It's for before writing code that uses the component: the anti-patterns are the part a model gets wrong from priors.

read-only

Argument	Type	Description
name*	string	Registry name ("echo-hardware-button"), bare name ("hardware-button") or title ("HardwareButton").

Input schema (JSON)

{
  "type": "object",
  "$schema": "http://json-schema.org/draft-07/schema#",
  "required": [
    "name"
  ],
  "properties": {
    "name": {
      "type": "string",
      "description": "Registry name (\"echo-hardware-button\"), bare name (\"hardware-button\") or title (\"HardwareButton\")."
    }
  }
}

get_examples

Just the usage examples for one component, without the rest of its record. For when the component is already chosen and only its calling convention is needed.

read-only

Argument	Type	Description
name*	string	Registry name, bare name or title.

Input schema (JSON)

{
  "type": "object",
  "$schema": "http://json-schema.org/draft-07/schema#",
  "required": [
    "name"
  ],
  "properties": {
    "name": {
      "type": "string",
      "description": "Registry name, bare name or title."
    }
  }
}

get_tokens

The token families: Layer-3 semantic colour roles (--echo-*), sound names, motion's whole vocabulary — the motion tokens, the spring presets, the morph feels and the CSS duration and ease steps — and the shadow recipes. Any name a component's record lists under Motion is here. Echo components are styled and moved only through these: a hex, a duration or a shadow written by hand, or a token name that isn't here, is off Echo's system.

read-only

No arguments.

Input schema (JSON)

{
  "type": "object",
  "$schema": "http://json-schema.org/draft-07/schema#",
  "properties": {}
}

list_styles

Echo's own styles, the looks Echo publishes, each with its one line and its fingerprint on the seven axes styles are placed on; or, with a name, one of them in full: its settings, rules, refusals, fonts, decisions and the slop police's word. The builder's own styles aren't here: they're in their library or the conversation, and fit_styles weighs them with Echo's.

read-only

Argument	Type	Description
name	string	One of Echo's styles, e.g. "echo". Omit to list them all.

Input schema (JSON)

{
  "type": "object",
  "$schema": "http://json-schema.org/draft-07/schema#",
  "properties": {
    "name": {
      "type": "string",
      "description": "One of Echo's styles, e.g. \"echo\". Omit to list them all."
    }
  }
}

search_components

Find the Echo UI item for a job ("a settings toggle", "confirm a delete") or by name. Leads with the best fit, or says plainly that Echo has nothing for the job yet, then lists every match with its install command. The cheapest way to find out what exists, and the first call before writing Echo code.

read-only

Argument	Type	Description
query	string	A job in plain words, or a name. Omit to list everything.

Input schema (JSON)

{
  "type": "object",
  "$schema": "http://json-schema.org/draft-07/schema#",
  "properties": {
    "query": {
      "type": "string",
      "description": "A job in plain words, or a name. Omit to list everything."
    }
  }
}

wear_style

What a style gives a project: a link that makes the whole Echo site wear its colours, the commands that put it in a project, and, for a project without a terminal, its theme CSS and a DESIGN.md with its rules. One of Echo's styles by name, or the builder's own style.json. A style the slop police stops isn't worn; the answer says what to ask the builder.

read-only

Argument	Type	Description
name	string	One of Echo's styles, e.g. "echo".
files	boolean	Include the theme CSS and DESIGN.md (the default). False when the builder will run the command in a project, which writes both itself.
style	object	The builder's own style.json, as a JSON object.

Input schema (JSON)

{
  "type": "object",
  "$schema": "http://json-schema.org/draft-07/schema#",
  "properties": {
    "name": {
      "type": "string",
      "description": "One of Echo's styles, e.g. \"echo\"."
    },
    "files": {
      "type": "boolean",
      "description": "Include the theme CSS and DESIGN.md (the default). False when the builder will run the command in a project, which writes both itself."
    },
    "style": {
      "type": "object",
      "description": "The builder's own style.json, as a JSON object.",
      "propertyNames": {
        "type": "string"
      },
      "additionalProperties": {}
    }
  }
}

Echo UI

Registry entry

Try it

check_code Read-only

Echo UI

Registry entry

Try it

check_code Read-only

Install

Tools (10)

Security checkA100/100