# CatchUI > CatchUI is a bilingual web app that identifies recognizable UI patterns in interface screenshots and teaches their conventional names, purposes, and tradeoffs. CatchUI is built for design students, career-switchers, product managers, and developers who understand what an interface element does but do not yet know what it is called. Recognition is model-assisted and may occasionally be wrong; the 28-pattern teaching catalog is curated. ## Key facts - Canonical product URL: https://catchui.com/ - Primary task: identify and learn UI/UX pattern names from screenshots - Languages: English and Simplified Chinese - Catalog size: 28 curated patterns - Pricing: the catalog and built-in sample are free without sign-up; anonymous visitors can run up to 3 screenshot scans per day; a free account includes a 30-scan pool; CatchUI Pro is $6/month or $60/year and includes 300 scans per day - CatchUI is a vocabulary and learning tool, not a screenshot-to-code generator or design-cloning service - Facts last verified: 2026-08-02 ## Primary pages - [Product facts and FAQ](https://catchui.com/about): citation-ready description, audience, workflow, limitations, and direct answers - [Scan a screenshot](https://catchui.com/scan): upload an interface screenshot for model-assisted recognition - [UI Pattern Catalog](https://catchui.com/catalog): curated pattern definitions and related terminology - [Privacy Policy](https://catchui.com/legal/privacy.html): how uploads, accounts, analytics, and billing data are handled - [Terms of Service](https://catchui.com/legal/terms.html): service rules, quotas, and limitations ## Machine-readable resources - [Full product and catalog context](https://catchui.com/llms-full.txt): expanded product facts plus every catalog definition - [XML sitemap](https://catchui.com/sitemap.xml): canonical crawlable URLs ## Pattern catalog - [Segmented control](https://catchui.com/catalog/segmented): A row of equal buttons where exactly one wins at a time. Best for 2–5 flat views of the same thing — never for actions. (also called: segmented button, segment control) - [Tab bar](https://catchui.com/catalog/tabbar): The app's whole map in one strip — three to five destinations, always visible, never scrolling away. (also called: bottom navigation bar, bottom app bar, bottom bar) - [Breadcrumb](https://catchui.com/catalog/breadcrumb): The trail of where you are: every ancestor is a link, the current page is plain text. If users never go deep, don't scatter crumbs. - [Pagination](https://catchui.com/catalog/pagination): Numbered stops through a long list, with previous and next as bookends. Users trade endless scroll for a sense of place. - [Hamburger menu](https://catchui.com/catalog/hamburger-menu): Three stacked lines hiding the whole navigation behind one tap. Saves space, costs discoverability — everything inside is out of sight. (also called: hamburger icon, three-line menu, menu icon) - [Toggle switch](https://catchui.com/catalog/toggle): An instant on/off for a single setting. If the change doesn't take effect immediately, it should be a checkbox instead. - [Search field](https://catchui.com/catalog/search): A pill-shaped prompt for queries. The little magnifier is one of the few icons everyone reads instantly. - [Stepper](https://catchui.com/catalog/stepper): Two buttons joined at the hip for small, precise adjustments — quantities, copies, guests. - [Checkbox](https://catchui.com/catalog/checkbox): A small square that collects independent yes/no answers — any number can be ticked at once. The deferred cousin of the toggle: nothing happens until you submit. - [Radio group](https://catchui.com/catalog/radio-group): Round buttons where picking one releases the others — exactly one answer from a visible set. Named after mechanical car-radio presets. - [Slider](https://catchui.com/catalog/slider): A thumb dragged along a track to pick a value in a range. Great for rough, feel-based settings; terrible when the exact number matters. - [Date picker](https://catchui.com/catalog/date-picker): A pop-open calendar for choosing a day without typing it. The moment ranges or availability rules appear, this pattern earns its complexity. - [Filter chips](https://catchui.com/catalog/chip-filter): Small rounded tokens that toggle facets of a list on and off. The active set doubles as a summary of what you're looking at. - [Floating action button](https://catchui.com/catalog/fab): One round button floating above everything, reserved for the screen's single most important action. Two FABs means zero priorities. (also called: FAB, floating button) - [Button group](https://catchui.com/catalog/button-group): Related actions lined up shoulder to shoulder, sharing borders and importance. When one matters most, it gets the filled style — the rest stay quiet. - [Bottom sheet](https://catchui.com/catalog/bottomsheet): A card that slides up over the screen for a quick sub-task while keeping the parent visible. (also called: bottom drawer, slide-up panel, sheet) - [Modal dialog](https://catchui.com/catalog/modal): A window that dims the world and demands an answer before anything else can happen. Powerful and rude — spend it only on decisions that truly block. (also called: modal window, dialog box, popup dialog) - [Action sheet](https://catchui.com/catalog/action-sheet): A slide-up list of verbs answering one question: "what do you want to do with this?" Destructive options sit apart, dressed in red. - [Tooltip](https://catchui.com/catalog/tooltip): A tiny label that appears on hover or focus to name or explain the thing under the pointer. If the interface needs it to be understood, the interface is hiding too much. - [Toast](https://catchui.com/catalog/toast): A short confirmation that pops in, delivers one line, and leaves on its own. Never put anything in a toast the user must act on. (also called: snackbar, toast notification) - [Progress bar](https://catchui.com/catalog/progress-bar): A track that fills to show how much of a job is done. Honest ones are tied to real work; the rest are just animated apologies. - [Skeleton screen](https://catchui.com/catalog/skeleton): Grey ghost shapes standing in for content while it loads, promising the layout before the data arrives. Feels faster than a spinner because it shows where things will land. (also called: skeleton loader, ghost elements, content placeholder) - [Empty state](https://catchui.com/catalog/empty-state): What a screen says when there's nothing to show. The good ones explain why it's empty and hand you the one action that fills it. - [Badge](https://catchui.com/catalog/badge): A tiny count or dot pinned to an icon, whispering "something's waiting for you in here." Loses all power the day it's always on. (also called: notification badge, notification dot, red dot) - [Card](https://catchui.com/catalog/card): A bounded container that makes one item — image, title, meta, action — feel like a single graspable thing. The workhorse of every feed and grid. - [Carousel](https://catchui.com/catalog/carousel): A horizontal strip of items you swipe through, with a peek of the next one as the invitation. Position dots keep you honest about how deep it goes. (also called: image slider, slideshow) - [Accordion](https://catchui.com/catalog/accordion): Stacked headers that expand one section at a time, keeping long content scannable. The chevron is the promise; the collapse is the mercy. - [Data table](https://catchui.com/catalog/table): Rows and columns for comparing many records across the same attributes. Sortable headers are the contract; alignment does the reading.