NameThatUI
Visual dictionary that maps 76 web and macOS UI elements to their real names and code
NameThatUI is a reference site that answers "what is this thing called?" for 44 web elements and 32 macOS elements. Each entry names the pattern, breaks down its anatomy part by part, lists the phrases people mistakenly use for it, and gives the exact API symbol in CSS, Tailwind, SwiftUI, AppKit and Electron. Every page ships a paste-ready build prompt and a separate debug prompt listing the classic failure modes. It also carries 14 visual-style pages ("Name That Vibe") and 18 head-to-head "X vs Y" disambiguation pages.
Use this as the disambiguation layer before you write component code: when a user says "the grid with one big box" or "the thing that slides up from the bottom", look up the element here to get the canonical name, then use the page's own paste-ready prompt as your build spec. The 'In code' table is the real value — it gives the literal API symbol per framework (CSS grid-column, Tailwind col-span, SwiftUI, AppKit), which stops you from hallucinating a React idiom into a SwiftUI file. Every page has 'Copy page as Markdown' and the site serves llms.txt, so fetch the page directly rather than guessing; the debug prompts are worth pasting verbatim when a layout misbehaves.
Why it is here. It is the only resource that translates a user's vague description into a canonical component name AND the exact per-framework API symbol, which is precisely the lookup an AI coding agent needs and normally has to guess at.
- 44 web + 32 macOS elements named
- paste-ready build and debug prompts per element
- cross-framework API symbol translation table
- 18 'X vs Y' disambiguation pages
- llms.txt and copy-as-Markdown on every page
Verified 2026-08-15. HTTP 200. https://namethatui.com/, https://namethatui.com/sitemap.xml, https://namethatui.com/web/bento-grid, https://namethatui.com/llms.txt (HEAD 200)








