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

# Autocomplete

> Learn how to build an autocomplete search experience with React InstantSearch.

<Note>
  This is the **React InstantSearch v7** documentation.
  If you're upgrading from v6, see the [upgrade guide](/doc/guides/building-search-ui/upgrade-guides/react/#migrate-from-react-instantsearch-v6-to-react-instantsearch-v7).
  If you were using React InstantSearch Hooks,
  this v7 documentation applies—just check for [necessary changes](/doc/guides/building-search-ui/upgrade-guides/react/#migrate-from-react-instantsearch-hooks-to-react-instantsearch-v7).
  To continue using v6, you can find the [archived documentation](https://algolia.com/old-docs/deprecated/instantsearch/react/v6/api-reference/instantsearch/).
</Note>

**Autocomplete is a ubiquitous part of most search experiences.**
Search providers like Google, ecommerce sites like Amazon,
and messaging apps like Slack all offer autocomplete experiences on mobile and desktop.

Algolia provides a full-featured solution to build autocomplete experiences with React InstantSearch. The [`<Autocomplete>`](/doc/api-reference/widgets/autocomplete/react) widget lets you build an accessible, as-you-type autocomplete user interface that you can integrate anywhere on your site or app.

<Columns>
  <Card title="Open CodeSandbox" icon="codesandbox" href="https://codesandbox.io/s/github/algolia/instantsearch/tree/master/examples/react/query-suggestions">
    Run and edit the Autocomplete example in CodeSandbox.
  </Card>

  <Card title="Explore source code" icon="github" href="https://github.com/algolia/instantsearch/tree/master/examples/react/query-suggestions">
    Browse the source for the Autocomplete example on GitHub.
  </Card>
</Columns>

A common pattern in search is to implement a search box with an autocomplete as a first step of the search experience. **Adding an autocomplete to a search page lets you enhance the search experience and create a richer, more contextual search.**

You can use the [`<Autocomplete>`](/doc/api-reference/widgets/autocomplete/react) widget in an existing or a new React InstantSearch implementation to create this kind of experience.

To learn more, see [Build a Query Suggestions UI](/doc/guides/building-search-ui/ui-and-ux-patterns/query-suggestions/tutorials/building-query-suggestions-ui/react).