algolia/docsearch

:blue_book: The easiest way to add search to your documentation.

4,378

stars

1,684

commits

TypeScript

primary language

Sep 10, 2026

updated

docsearch.algolia.com
algolia
docsearch
documentation
javascript
react
search
typescript

README

DocSearch

The easiest way to add search to your documentation – for free.

Netlify Status npm version Used by License

DocumentationJavaScript PlaygroundReact Playground


DocSearch crawls your documentation, pushes the content to an Algolia index and provides a dropdown search experience on your website.

Preview

Ask AI demo

Usage

Don't have your Algolia credentials yet? Apply to DocSearch!

JavaScript

Installation

bun add @docsearch/js@5
# or
npm install @docsearch/js@5

If you don’t want to use a package manager, you can use a standalone endpoint:

<script src="https://cdn.jsdelivr.net/npm/@docsearch/js@5"></script>

Get started

To get started, you need a container for your DocSearch component to go in. If you don’t have one already, you can insert one into your markup:

<div id="docsearch"></div>

Then, insert DocSearch into it by calling the docsearch function and providing the container. It can be a CSS selector or an Element.

Make sure to provide a container (for example, a div), not an input. DocSearch generates a fully accessible search box for you.

import docsearch from '@docsearch/js';

import '@docsearch/css';

docsearch({
  container: '#docsearch',
  appId: 'YOUR_APP_ID',
  indices: ['YOUR_INDEX_NAME'],
  apiKey: 'YOUR_SEARCH_API_KEY',
});

React

Installation

bun add @docsearch/react@5
# or
npm install @docsearch/react@5

If you don’t want to use a package manager, you can use a standalone endpoint:

<script src="https://cdn.jsdelivr.net/npm/@docsearch/react@5"></script>

Get started

DocSearch generates a fully accessible search box for you.

import { DocSearch } from '@docsearch/react';

import '@docsearch/css';

function App() {
  return (
    <DocSearch
      appId="YOUR_APP_ID"
      apiKey="YOUR_SEARCH_API_KEY"
      indices=["YOUR_ALGOLIA_INDEX"]
    />
  );
}

export default App;

Styling

Read documentation →

MCP plugins

Client plugins for the public DocSearch MCP endpoint are in mcp/plugins/docsearch. They connect ChatGPT, Codex, Cursor, and Claude Code to https://mcp.algolia.com/1/docsearch/mcp for current public developer documentation.

DocSearch is made of the following repositories:

Used by

DocSearch is used by Bootstrap, Cheerio, Element Plus, Authelia, MDX, VitePress and many more.

Used by Generated with usedby.dev

License

MIT

Contributors

(top 30 of 126)

renovate-bot

291 commits

renovate[bot]

180 commits

pixelastic

150 commits

algolia/docsearch

:blue_book: The easiest way to add search to your documentation.

4,378

stars

1,684

commits

TypeScript

primary language

Sep 10, 2026

updated

docsearch.algolia.com
algolia
docsearch
documentation
javascript
react
search
typescript

README

DocSearch

The easiest way to add search to your documentation – for free.

Netlify Status npm version Used by License

DocumentationJavaScript PlaygroundReact Playground


DocSearch crawls your documentation, pushes the content to an Algolia index and provides a dropdown search experience on your website.

Preview

Ask AI demo

Usage

Don't have your Algolia credentials yet? Apply to DocSearch!

JavaScript

Installation

bun add @docsearch/js@5
# or
npm install @docsearch/js@5

If you don’t want to use a package manager, you can use a standalone endpoint:

<script src="https://cdn.jsdelivr.net/npm/@docsearch/js@5"></script>

Get started

To get started, you need a container for your DocSearch component to go in. If you don’t have one already, you can insert one into your markup:

<div id="docsearch"></div>

Then, insert DocSearch into it by calling the docsearch function and providing the container. It can be a CSS selector or an Element.

Make sure to provide a container (for example, a div), not an input. DocSearch generates a fully accessible search box for you.

import docsearch from '@docsearch/js';

import '@docsearch/css';

docsearch({
  container: '#docsearch',
  appId: 'YOUR_APP_ID',
  indices: ['YOUR_INDEX_NAME'],
  apiKey: 'YOUR_SEARCH_API_KEY',
});

React

Installation

bun add @docsearch/react@5
# or
npm install @docsearch/react@5

If you don’t want to use a package manager, you can use a standalone endpoint:

<script src="https://cdn.jsdelivr.net/npm/@docsearch/react@5"></script>

Get started

DocSearch generates a fully accessible search box for you.

import { DocSearch } from '@docsearch/react';

import '@docsearch/css';

function App() {
  return (
    <DocSearch
      appId="YOUR_APP_ID"
      apiKey="YOUR_SEARCH_API_KEY"
      indices=["YOUR_ALGOLIA_INDEX"]
    />
  );
}

export default App;

Styling

Read documentation →

MCP plugins

Client plugins for the public DocSearch MCP endpoint are in mcp/plugins/docsearch. They connect ChatGPT, Codex, Cursor, and Claude Code to https://mcp.algolia.com/1/docsearch/mcp for current public developer documentation.

DocSearch is made of the following repositories:

Used by

DocSearch is used by Bootstrap, Cheerio, Element Plus, Authelia, MDX, VitePress and many more.

Used by Generated with usedby.dev

License

MIT

Contributors

(top 30 of 126)

renovate-bot

291 commits

renovate[bot]

180 commits

pixelastic

150 commits

Languages

TypeScript

50.7%

MDX

31.7%

JavaScript

8.8%

CSS

8.8%