Open Source Search

Pagefind

Static search indexing designed specifically for static websites.

Official Website: pagefind.app
Category: Search
Edit Markdown Guide

Pagefind

Static search indexing designed specifically for static websites.


Overview

Pagefind is a fully static search library developed by Cloudflare that indexes your built static HTML files after your build step. It produces pre-built search index shards that are downloaded on-demand by the browser using WebAssembly.

Because it runs completely in the browser and loads only tiny index chunks as the user types, Pagefind requires zero hosted infrastructure, zero server APIs, and scales effortlessly.


Key Highlights & Features

  • Zero Backend: Runs entirely on your static host; no hosted search service required.
  • Negligible Bandwidth: Chunks search indexes so users download only what they query.
  • Pre-Built UI: Includes an accessible, responsive search UI component out of the box.
  • Framework Agnostic: Works with Astro, Hugo, Eleventy, Jekyll, VitePress, and plain HTML.

How It Works with Static Websites

  1. Run Pagefind after building your site:
npx pagefind --site dist
  1. Include Pagefind UI in your static HTML:
<link href="/pagefind/pagefind-ui.css" rel="stylesheet">
<script src="/pagefind/pagefind-ui.js"></script>

<div id="search"></div>
<script>
  window.addEventListener('DOMContentLoaded', () => {
    new PagefindUI({ element: "#search", showSubResults: true });
  });
</script>

When to Use It

  • Documentation sites, technical blogs, and large static knowledge bases.
  • Websites that want fast, robust full-text search with zero ongoing server costs.
  • Static sites deployed on GitHub Pages, Cloudflare Pages, Netlify, or Vercel.

Community Discussion

Ask questions, share integration tips, or leave feedback.

Back to Search Browse Full Archive Visit Official Site