A practical UI component naming reference with 170 embedded Tailwind examples for web and mobile mockups, specs, and implementation tickets.

Terminology note: the provider names, repository names, and pattern names in the source list are factual references from public documentation. The grouping in this article is an editorial taxonomy for product mockups and front end specifications, not a universal standard. The examples are compact Tailwind mockups embedded directly in the article. They are not vendor screenshots, and each one links to a standalone version you can open or paste into an online code tester. When preparing a mockup, use these names as labels in the design file, issue tracker, or implementation ticket. A sentence such as "open the edit user side sheet from the table toolbar" is much clearer than "open that panel from the thing above the grid". The embedded demos are intentionally compact. Production components s

Latest writing

The UI Component Naming Guide: 170 Web and Mobile Patterns for Mockups and Specs