Styling Without Tailwind | Yext Hitchhikers Platform

If you are not inclined to use Tailwind, you can optionally import our bundle.css stylesheet like so:

import '@yext/search-ui-react/bundle.css'

This will use the component library’s styling without adding Tailwind, allowing you to customize the components with whatever CSS style of your choice.

For example, if you wanted to use vanilla CSS you could do so by importing a CSS file and referencing it in your component customCssClasses property like so:

import "./App.css";
import "@yext/search-ui-react/bundle.css";

function App() {
  return <SearchBar customCssClasses={{ container: "search-container" }} />;
}

Back

< Setting Cloud Region

<% elem.innerText %>