Table of Content
It is very easy to make a search bar design in Figma. Here’s a short tutorial on how to do it:
1.With the rectangle tool, draw a rounded shape as your main layer for the search bar.
2.Set a small magnifying glass icon on the left to let visitors know that they can search with your site.
3.Add a hint next to the icon using light gray that reads “Search here...” to allow input easily.
4.To keep everything aligned, select the icon, text and shape, then group them once the search bar is in place.
5.Include soft shadows or borders and make the search box interactive by adding a hover effect.
