Skip to main content
skill CX Codex

search · mobbin — Claude Code skill: what it does, how to install

Tunes queries for Mobbin UI tools. Guides the agent to pick matching screens, flows, and marketing sections without over-filtering.

Install into Claude Code · Skills CLI (Vercel) All methods and platforms ↓
npx skills add mobbin/skills --skill search -a claude-code
Open on GitHub

What search does

This skill guides how an agent queries search_screens, search_flows, and search_sections. Mobbin search relies on meaning rather than keyword lists. The skill instructs the model to construct natural phrases and skip unrequested details such as avatars or plan toggles.

Queries carry at most three constraints, counting visual traits like modal or bottom sheet. Single-screen lookups switch mode between standard and deep. To gather more screens without repeating matches, the agent issues a second pull using exclude_screen_ids up to 100 items, or increments page on sections and flows.

Mobbin search tools lack an Android filter. Any Android search runs against platform: ios, so every reference must be cited as iOS.

What it helps with

  • write semantic search queries for Mobbin screens and flows
  • select the right tool between screens, flows, and web sections
  • fetch additional UI references using exclude_screen_ids
  • find interface patterns for mobile apps and onboarding flows

Example prompts for the agent

  • Find paywall screens with plan cards and a free trial button
  • Search for pricing sections on marketing websites
  • Show the email verification flow during sign-up

How to install search

1Skills CLI (Vercel)

npx skills add mobbin/skills --skill search -a claude-code

2Manually: put the files in place

~/.claude/skills/search/SKILL.md

Copy the whole skill folder; for one project use .claude/skills/search/

Step by step, with commands for each platform: How to install skills in Claude Code: five ways

Questions about search

How to install search in Claude Code?

Run npx skills add mobbin/skills --skill search -a claude-code in your terminal. It stores the skill at ~/.claude/skills/search/SKILL.md.

What does the search skill do?

It teaches the agent how to build clean search queries for Mobbin, choose between screen and flow tools, and handle pagination.

How does it handle Android UI requests?

The underlying tools support only ios and web. The skill targets ios for Android queries and labels the results as iOS.

Source text

SKILL.md · MIT
---
name: search
description: Gets better results from every Mobbin search, so the references match what you're working on. Use before every call to search_screens, search_flows or search_sections. Covers the tool, writing an effective query, the mode, pulling more results, and what to do when a search falls short.
---

# Searching Mobbin

**Read best practices first.** If the Mobbin `best-practices` skill hasn't been read in this conversation, invoke it before searching, since it says when a search should run at all and when another skill should run it.

A calling skill may set its own search rules, such as how many queries per problem or which mode to use. Where they differ from these, the calling skill's rule wins.

## How search works

- **Search matches meaning, not keywords.** A plain phrase ("paywall with a free trial") works better than a list of keywords ("paywall, trial, subscription, pricing").
- **Name an app only when the task needs it.** Adding an app name to the query filters results to that app. But not every result is from that app, so check `app_name` and `site_name` before citing.
- **The query also sets a language filter** on screens and flows when it names one ("Japanese banking app"). Name a language only when the task needs it.
- **When results are weak, change the query.** Drop or reword a constraint, or use the user's own words. Don't add parts they didn't ask for. Raising `limit` or resending the query as it was brings back the same matches. To get more results for a query that works, see [A second pull](#a-second-pull).

## Choosing the tool

| Target | Tool |
|---|---|
| A screen or component in an app | `search_screens` with `platform` |
| A section of a marketing site (hero, pricing, feature grid, footer) | `search_sections`, which takes no `platform` |
| A journey, or one screen whose place in a journey matters (the verify-email step of sign-up) | `search_flows` with `platform`. For one screen, pick it from the flow's screens. Only some screens come with a preview; open the `image_url` of any other before citing it |

`platform` is `ios` or `web`, and it is the only filter you set. The tools have no Android, so an Android target searches `ios`. Say the references are iOS wherever you cite them.

## Writing the query

**One screen, flow or section per query.** Start with its type, which is the target. A bare type is a good query.

Every query stays within these limits:

- **At most three constraints.** Each state, step, visible part or visual trait (`dark mode`, `bottom sheet`) is one: "paywall with plan cards and a free trial button" has two. The type ("paywall", "signup screen"), the domain ("meditation app", "banking app") and an app name ("Calm", "Revolut") are not constraints, so "Calm paywall with plan cards" has one. If the request has more than three, keep the three that matter most and check the results for the rest by looking at them. Don't move the rest to a second query about the same target: each query would find screens with only some of the parts.
- **Every constraint comes from the request or the problem.** Never add parts you expect the target to have, such as an avatar on a profile or plan cards on a paywall. They narrow the results to screens that match your guess.

Rules:

- **Search at the target's level.** A screen target searches the whole screen ("expense tracker home with no transactions"), never one card of it. A component target searches the screen it lives on.
- **When the task is choosing between options, name the part, not one of the options.** The results need to show more than one way to solve it: "paywall with plan cards and a free trial button", not "paywall with a yearly toggle". Don't join options with "or", and don't put a fix in the query ("with a prompt to add", "placeholder bars"). When the task is finding that exact thing, name it ("banking app search tab with a text label").
- **Say each thing once.** "Empty state", "no transactions yet" and "before any are added" are one state. Keep the shortest.

| Don't | Do |
|---|---|
| "social app user profile with avatar, follower counts and post grid" (when the user's question is simply "find me profile screens from social apps", this adds parts nobody asked for) | "social app user profile screen" |
| "paywall where the trial button is buried below a long table" (the problem in the query) | "paywall with a free trial button" |
| "expense tracker home overview in empty state with no transactions yet and prompt to add first expense" (the state said twice, a fix named) | "expense tracker home with no transactions" |
| "spending chart card with no data yet, placeholder bars or empty donut" (one card of a screen target, two options joined by "or") | "spending overview with no transactions" |
| "ios signup screen" (platform in the query) | "signup screen", with `platform` `ios` |
| "clean modern invoice list for Acme" (taste words, the user's product) | "invoice list" |
| "onboarding paywall settings" (several screen types in one query) | one call per screen type |
| "pricing page with hero, plans and FAQ" (several sections in one query) | one call per section |
| "invite teammates screen" (one screen, when the target is a journey) | "inviting teammates during workspace setup", on `search_flows` |

Leave out the user's copy, data and brand, and instructions such as "examples of" or "best". Visual traits Mobbin tags help when the request or problem names them: `dark mode`, `bottom sheet`, `modal`, `full-screen`, `card-based`.

When a pull returns products from outside the task's domain, search again with the domain's noun ("meditation app paywall") instead of citing them. If you do cite a product from another domain, say it is there for its structure only.

## Choosing the mode

`mode` is on `search_screens` only. Pick it from the query you wrote:

| The query | `mode` |
|---|---|
| No constraints ("social app user profile screen", "Calm paywall") | `standard` |
| One to three constraints ("paywall with lifetime option and a discount") | `deep` |

`deep` drops matches it scores as weak, so it can return fewer results than `limit`. A short pull means few close matches, not that Mobbin has none. Send a second pull or change the query before you say something is missing.

## A second pull

When a pull doesn't cover what you need, send the same query again with the tool's way of getting more results. That brings new results instead of the first ones reordered. Changing the query makes it a new search, even with exclusions.

- `search_screens`: the same query and `mode`, with every id already seen in `exclude_screen_ids`, up to 100.
- `search_sections` and `search_flows`: the next `page`, dropping results already seen. When `has_next_page` is false, there is no next page, so change the query instead.

## When a search falls short

Handle each case as below. When one still fails, say so in one line, where the calling skill reports a lost search or in the reply when there is none.

**A named product doesn't come up**, meaning it's in no result's `app_name` or `site_name`:

1. If the query spelled the name differently from the product, search again with the product's own spelling.
2. On sections, which have no name filter, ask for the next `page` while `has_next_page` is true. The site may rank past the first page.
3. On screens and flows, when the task isn't tied to one platform, try the other `platform`, since a product can be on Mobbin for iOS or web only. Cite what you find as that platform. Skip this step when the task is for one platform (an iOS redesign has no use for a web screen).

If it's still missing, carry on with the category search. Describe nothing about the product from memory, and don't let another product's screen stand in for it. A screenshot the user shared of it stays their reference.

**Images don't open.** Previews come as `webp`, which not every host can open. Call again with `image_format` set to `jpg`. If they still don't open, cite nothing from that call, since a screen you couldn't see is not a reference.

**The tool refuses the call.** Don't retry it or change the query, since every call will be refused. Stop searching and say so. An error about the input, such as an invalid argument, is different: fix the input and call again.

© mobbin · MIT · mobbin/skills

Similar skills

Everything for Design →

search by other authors comes first.

search official anthropics Runs parallel queries across connected MCP tools and synthesizes the findings into a single answer. Helpful when decisions or notes are scattered across chat, email, and storage. CX Codex +1 5,000installs search browserbase The skill runs web searches through Browserbase's Search API and returns links with titles, authors and publish dates, without opening a browser session. CX Codex +1 2,800installs search brightdata Searches the web using the Bright Data CLI. Runs keyword SERP queries across Google, Bing, and Yandex or discovers pages ranked by semantic intent. CX Codex +1 7,500installs search entireio Searches recorded Entire history, checkpoints, and decisions across repositories. It gives agents past architectural context before reading local source files. CX Codex +1 458installs search aladicf Walks an agent through designing site search: autocomplete, filters, result lists and recovery from zero results. CX Codex +1 626installs frontend-design official anthropics This skill guides intentional visual design for new interfaces and redesigns. Use it when a generic generated UI is not enough. 1,025,790installs grill-me Matt Pocock grill-me interviews you about a plan or design to expose gaps and sharpen decisions. Use it before implementation starts. 1,424,476installs design-taste-frontend Leonxlnx This skill directs the design of public pages and work screens, then checks the result in a browser through screenshots. Use it when an interface feels generic or unfinished. CX Codex +1 678,700installs prototype Matt Pocock Creates throwaway prototypes for checking state logic or exploring UI before committing the decision to the main codebase. 986,201installs grilling Matt Pocock Stress-test a plan, decision, or idea through structured rounds of questions. Use it when you need to expose assumptions before acting. 979,543installs codebase-design Matt Pocock This skill helps design modules with small interfaces and hidden complexity. Use it when refactoring code, choosing a seam, or making tests easier to write. 850,344installs

Project sponsors

Companies that keep this analytics open
Gold sponsor

Impressions, clicks and code copies — open statistics. We keep the numbers public for the same reason NeBlask itself is public. Become a sponsor