ui-grammar

Installation
SKILL.md

UI Grammar

Use UI Grammar to talk precisely about what a UI is, why it has that shape, and which React pieces may compose it. It is a reasoning and communication lens, not a schema, compiler, registry, or source of product truth. Code and the rendered product remain master.

Choose the direction

  • Recover: understand an existing route or component system from its rendered result and live source. An unqualified request such as “use UI Grammar to describe the Connections route” means Recover.
  • Design: turn a visual reference or product intent into a React vocabulary and composition contract before or during implementation.

Use both only when the task genuinely moves from understanding an existing surface into redesigning it.

Keep claims honest

Label material distinctions when they matter:

  • Observed: directly visible in source, runtime, or rendered evidence.
  • Declared: intended product or design-system law supplied by an owner or authoritative reference.
  • Derived: a conclusion that follows from observed facts plus declared law.
  • Unknown: not established by the available evidence.
Installs
9
GitHub Stars
1
First Seen
Aug 18, 2026