About Ui Hierarchy
Ui Hierarchy is an MCP server in the Agents category: mCP server that returns a Next.js App Router project's UI component hierarchy as a structured tree (markdown + JSON) so AI coding agents can ground image/description-based UI edits in exact file/component locations.
Install
claude mcp add ui-hierarchy -- npx -y ui-hierarchy-mcpnpx -y ui-hierarchy-mcpThis server has no ConduID identity, so agent calls to it are not receipted. Pin the version you install and review the source before granting it credentials.
Tools (4)
find_by_styleFinds component nodes that use a given CSS class name or style prop. Returns nodes with `file:line` location.
Parameters not published.
find_by_textFinds component nodes whose rendered text content matches a query string. Returns nodes with `file:line` location.
Parameters not published.
focus_onReturns the component subtree rooted at a named JSX component, optionally including ancestors.
Parameters not published.
get_full_hierarchyReturns the ordered layout chain and page component subtree for a Next.js App Router route.
Parameters not published.
Ask AI
Ask AI about Ui Hierarchy
Powered by Claude · Grounded in docs
Security checks
6 checks have not been run yet.