Overview

Here's a sample project that shows you how to create a custom search bar in Framer without any code. The search bar relies on Framer's built-in search functionality, yet it can be customised however you want.

If you're interested in learning how it's made, I've created a step-by-step tutorial that shows you how to do it from scratch. You can find it here.

Limitations

This method works by using Framer's built-in search component. Unfortunately, this functionality has a search limit based on your site plan.

The search limit for a Basic plan is set to 10 pages, meaning that the search functionality can only search among 10 pages (including CMS-generated pages).

For the Pro plan, the search functionality will work with CMS collections and sites up to 300 pages.

If you want an unlimited search functionality, you'll either have to pay for an add-on of $20/mo or move to the enterprise plan.