Cool Search bar
This is a very cool search bar created using HTML and CSS3 without any extra markup. The background pattern on the search bar is created using linear-gradient
and background-size
. Linear gradient helps in creating the pattern (no. of strips and colors) while background size is used to resize the pattern for repetition. The shine on the outer box is created using a inset box-shadow
having rgba
color for transparency.
Other effects like bevel and indentation is created using multiple box-shadows
on a single element. Take a look at the HTML and CSS Code to learn more about it.