---
title: "Page Search — Framer component · Best of Framer"
description: "$9.00 · Framer component · by Aidan Looker · Forms. What is Page Search?"
canonical: "https://framer.elliotli.dev/component/page-search"
---

[Home](/)/[Components](/components)/[Forms](/components/category/forms)/Page Search

# Page Search

Find-on-page search button & function

[View on Framer](https://framer.com/marketplace/components/page-search/?via=elliot-li)

![Page Search preview image 1](https://framer.elliotli.dev/og/component/page-search/4dc2e55fc50b0b4e/1600x1200.jpg)

## Summary

What is Page Search?

## Description

## What is Page Search?

Page Search adds a Find-on-Page search overlay to your site. It works like your browser's built-in Ctrl+F — but with a beautiful, branded UI that matches your site. Visitors can search, highlight, and navigate to any text on the page in real time. Ideal for blogs, documentation sites, knowledge bases, and content-heavy portfolios.

[![](https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/description-image-8vjwbcr2-RQLDut7AgLOovQEwgaJNpNG4n3n3B6)](https://teampixelau.lemonsqueezy.com/checkout/buy/3b016e8d-2ba4-4944-8431-e2c592334df1)

## Core Features

-   Live text highlighting across all visible page content as the user types
    
-   Match counter with previous/next navigation using arrow keys or chevron buttons
    
-   Scrollable match list panel showing context snippets for every result
    
-   Glassmorphism search bar with dark and light theme options
    
-   Smooth scroll to each match with active highlight glow
    
-   Case-sensitive search toggle built into the search bar
    
-   Enter to confirm and close at your selected result, Esc to dismiss
    
-   5 highlight colour presets: Yellow, Blue, Green, Pink, Orange
    
-   3 entry animations: Slide, Fade, Scale
    
-   4 button style presets: Indigo, Dark, Minimal, Emerald — with custom colour overrides
    
-   Configurable hover animation with adjustable scale
    
-   Overlay renders above all content
    
-   Performance-optimised with debounced search and configurable max match limit
    

## Controls inside Framer

### Trigger

-   Trigger mode (Button Only, Keyboard Shortcut, or Both)
    
-   Button label text
    

### Match List

-   Show or hide the scrollable match context panel
    

### Search Options

-   Case Sensitive default
    
-   Pattern Match mode
    
-   Max Matches limit (10-200)
    

### Appearance

-   Highlight colour (Yellow, Blue, Green, Pink, Orange)
    
-   Entry animation (Slide, Fade, Scale)
    
-   Bar position (Top, Center)
    
-   Theme (Dark, Light)
    

### Button Style

-   Style preset (Indigo, Dark, Minimal, Emerald)
    
-   Custom background colour override
    
-   Custom text colour override
    
-   Border radius
    
-   Show/hide search icon
    
-   Hover effect toggle (On/Off)
    
-   Hover scale amount
    

### Font

-   Custom font family and weight
    

## Best use cases

-   Documentation and knowledge base sites where visitors need to find specific topics quickly
    
-   Long-form blog posts and editorial content with keyword-dense pages
    
-   Portfolio and agency sites with extensive project case studies
    
-   SaaS marketing pages where prospects search for specific features or pricing details
    

Drop it onto any page, configure the trigger and appearance, and give your visitors a polished, branded search experience.

## Questions or custom requests?

We design and build custom Framer components. Get in touch at [contact@teampixel.com.au](mailto:contact@teampixel.com.au).

## Rank history [How rankings work →](/terms#rankings)

-   All · #10414

## Details

- **Author**: Aidan Looker
- **Price**: $9.00
- **Published**: 2026-03-26
- **Updated**: 2026-06-13
- **Added**: 2026-03-15
- **Categories**: Forms

## More across types

-   [Wallble: Guest Book & Wall of Love](/plugin/wallble-guest-book-wall-of-love) — Wallble · Free — Guest book & Wall of Love

## More like this

-   [Stay Booking Pro](/component/stay-booking-pro) — Design Foundry · $10 — Stay Planner with Dynamic Pricing
-   [Postcode Checker](/component/postcode-checker) — Sean Weekes · $15 — Do we cover your area? (UK
-   [Property Calculators](/component/property-calculators) — Sean Weekes · $12 — UK Stamp Duty, mortgage and yield
-   [UTM Lead Capture](/component/utm-lead-capture) — Sean Weekes · $9 — See where every lead came from