Designers

All 141 tools / Layout, grids and spacing

Analyse a navigation tree for depth, breadth, one-child branches, naming collisions and orphan pages

Navigation depthFreeFor designers and product teams

25/day

free runs a day, no sign-in.

Before: what you give it

The example input, as typed in. You paste text, CSS, markup or notes.

tree:
  Home
  Products
    Laptops
      Business laptops
        Ultrabooks
          14 inch
    Phones
  Support
    Help
    Contact
      Contact
  About
    Support
maxDepth: 4
maxBreadth: 9
pages:
  Pricing
  Support
  Products

After: what comes back

The first lines of a real run on that input. Nothing here is edited by hand.

13 nodes, 6 leaves, 4 top-level items, 5 levels deep. Limits used: depth 4, breadth 9.

Per level:
  level 1: 4 nodes, average 1.3 children
  level 2: 5 nodes, average 0.4 children
  level 3: 2 nodes, average 0.5 children
  level 4: 1 node, average 1 children
  level 5: 1 node, average 0 children

Widest branch: "Products" with 2 children.

10 findings:
  [medium] 1 item deeper than 4 levels, for example "Products > Laptops > Business laptops > Ultrabooks > 14 inch"
  [low] "Products > Laptops" has a single child ("Business laptops"); a one-item level adds a click and no choice
... full output on the tool page

What you get

Node and leaf counts, per-level breadth, branches over your limits, collisions, and orphans

What it cannot do

Checks structure and labels, not findability; defaults are depth 4 and breadth 9, which are conventions.

Who it is for

  • Designers
  • Product teams

Free and Pro

Free25 runs a day per IP address, up to 60,000 characters a run.
ProNo daily limit, 300 requests a minute, up to 200,000 characters a run.

What each plan includes

Use it from your assistant

The tool is called nav_depth_check. Connect the server once, then ask for it by name or just describe the job. Install steps for each app.

claude mcp add --transport http designers https://designers.allthepossibles.com/mcp
curl -X POST https://designers.allthepossibles.com/api/nav-depth-check -H 'content-type: application/json' -d '{"tree":"Home\nProducts\n  Laptops\n    Business laptops\n      Ultrabooks\n        14 inch\n  Phones\nSupport\n  Help\n  Contact\n    Contact\nAbout\n  Support","maxDepth":4,"maxBreadth":9,"pages":"Pricing\nSupport\nProducts"}'

Try it here

The form starts with the same example input, so you can run it first and then swap in your own.

More in layout, grids and spacing

All layout, grids and spacing tools