Search UI

A search interface that simply works

Search UI is a JavaScript search framework for implementing world-class search experiences without reinventing the wheel. It works out of the box so you can focus on thinking outside of it.

View Search UI on GitHub

Learn how to add rich, relevant search to your apps and websites with Elastic App Search

Watch video

See how to use Search UI to build premium search experiences.

Watch video

Elastic is a search company. Learn how we apply the power of search to a variety of use cases.

Watch video

New

Create App Search instances with the click of a button right from the Elastic Cloud console, and get the same great resource-based pricing.

Learn more

Flexible

Ready to React

Search UI is designed to work with React without any configuration, with pre-built connectors for Elastic App Search and Elastic Site Search. Download and import, it’s that simple.

npm install --save @elastic/react-search-ui @elastic/search-ui-app-search-connector

React

const connector = new AppSearchAPIConnector({
    searchKey: "search-soaewu2ye6uc45dr8mcd54v8",
    engineName: "national-parks-demo",
    hostIdentifier: "host-2376rb"
  });

  export default function App() {
    return (
      <SearchProvider
        config={{
          apiConnector: connector
        }}
      >
        {() => (
          <div className="App">
            <SearchBox />
            <Results
              titleField="title"
              urlField="nps_link"
            />
          </div>
        )}
      </SearchProvider>
    );
  }