> ## Documentation Index
> Fetch the complete documentation index at: https://docs.shipmobilefast.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Search

> Search Screen

## Prebuilt Search Screen

You have prebuilt Search Screen with Super Compatible [SearchBar](/components/searchbar).

<Frame className="flex flex-row w-full h-full gap-2">
  <img src="https://mintcdn.com/shipmobilefast-51a499dc/0OITnrSFpxUQjTf4/images/screens/search.png?fit=max&auto=format&n=0OITnrSFpxUQjTf4&q=85&s=fee244fac3891c74a98b859723bc71c1" alt="Search" className="rounded-lg mr-4" width="700" height="320" data-path="images/screens/search.png" />
</Frame>

<Note>
  Path: `/app/(auth)/(tabs)/search.tsx`
</Note>

<Info>
  You can customize the screen with your own design.
</Info>

### Result:

<Frame className="w-3/4 aspect-square">
  <img src="https://mintcdn.com/shipmobilefast-51a499dc/rNBXOQ08cKXtmr3A/images/mockups/search.png?fit=max&auto=format&n=rNBXOQ08cKXtmr3A&q=85&s=afa90385ea6ff7bfc8d03cf5d593569d" alt="Search Result" width={300} data-path="images/mockups/search.png" />
</Frame>

### Custom Search Functionality

How can you make it?

<Steps>
  <Step>
    Go to the `/app/(tabs)` folder and create a new folder with the name `search`.
  </Step>

  <Step>
    <Tip>
      Create a slug with `[id].tsx` and add it to the the `search` folder.
    </Tip>
  </Step>

  <Step>
    Add the search functionality to the `search/[id].tsx` file.
  </Step>

  <Step>
    Thats it! You have a custom search functionality. Like [Kroko Social](https://kroko.social)
  </Step>
</Steps>
