Search

A customizable search bar.

Galaxy Search Bar

A default search bar for searching the galaxy.

Preview

import React from "react";
import { GoSearch } from "react-icons/go";

const SearchBar = () => {
  return (
    <div className="w-[400px] flex items-center bg-gray-100 rounded-full px-4 py-3">
      <GoSearch size={20} color="gray" />
      <input
        placeholder="Search the galaxy..."
        className="flex-1 ml-2 text-base border-none outline-none bg-transparent"
      />
    </div>
  );
};

export default SearchBar;

Usage Example

import React from "react";
import SearchBar from "./components/comp/SearchBar/GalaxySearchBar";

const App = () => {
  return (
    <div>
      <SearchBar />
    </div>
  );
};

export default App;