Free HTML & CSS Search Form Templates

45 free search form and search bar templates, written in plain HTML and CSS. Open index.html and it works: no jQuery, no build step, no CDN calls. Each one drops into a Bootstrap 4, 5 or 6 project unchanged, or runs with no framework at all.

⭐ If these save you time, star this repo. It's how other developers find them.

Live previews of every template, plus more options from other designers: the full collection on Colorlib.

Contents

• Search forms (25)
• Search bars (20)

Search forms

Search Form 1 Demo · Code · Details	Search Form 2 Demo · Code · Details	Search Form 3 Demo · Code · Details
Search Form 4 Demo · Code · Details	Search Form 5 Demo · Code · Details	Search Form 6 Demo · Code · Details
Search Form 7 Demo · Code · Details	Search Form 8 Demo · Code · Details	Search Form 9 Demo · Code · Details
Search Form 10 Demo · Code · Details	Search Form 11 Demo · Code · Details	Search Form 12 Demo · Code · Details
Search Form 13 Demo · Code · Details	Search Form 14 Demo · Code · Details	Search Form 15 Demo · Code · Details
Search Form 16 Demo · Code · Details	Search Form 17 Demo · Code · Details	Search Form 18 Demo · Code · Details
Search Form 19 Demo · Code · Details	Search Form 20 Demo · Code · Details	Search Form 21 Demo · Code · Details
Search Form 22 Demo · Code · Details	Search Form 23 Demo · Code · Details	Search Form 24 Demo · Code · Details
Search Form 25 Demo · Code · Details

Search bars

Search Bar 01 Demo · Code · Details	Search Bar 02 Demo · Code · Details	Search Bar 03 Demo · Code · Details
Search Bar 04 Demo · Code · Details	Search Bar 05 Demo · Code · Details	Search Bar 06 Demo · Code · Details
Search Bar 07 Demo · Code · Details	Search Bar 08 Demo · Code · Details	Search Bar 09 Demo · Code · Details
Search Bar 10 Demo · Code · Details	Search Bar 11 Demo · Code · Details	Search Bar 12 Demo · Code · Details
Search Bar 13 Demo · Code · Details	Search Bar 14 Demo · Code · Details	Search Bar 15 Demo · Code · Details
Search Bar 16 Demo · Code · Details	Search Bar 17 Demo · Code · Details	Search Bar 18 Demo · Code · Details
Search Bar 19 Demo · Code · Details	Search Bar 20 Demo · Code · Details

How to use one

1. Clone the repo, or download it as a ZIP from the green Code button.
2. Copy the folder of the template you want into your project.
3. Open its index.html in a browser. Every folder is self-contained: css/style.css, a small js/snippet.js where the template needs behaviour, plus its own fonts and images.

Using Bootstrap already? Load the template's css/style.css after your framework stylesheet. Class names are namespaced per template, so they won't collide with yours.

License

Free for personal and commercial use, including client work. Attribution is appreciated but not required. Photography, where present, is licensed for use inside these templates. See LICENSE.md.

More free templates from Colorlib

• Free HTML & CSS Login Form Templates
• Free HTML & CSS Registration Form Templates
• Free Coming Soon & Under Construction Page Templates
• Free HTML & CSS Contact Form Templates
• Free 404 & Error Page Templates
• Free Multi-Step Form & Form Wizard Templates
• Free Booking & Appointment Form Templates
• Free Navigation Menu, Sidebar & Dropdown Templates
• Free HTML & CSS Table Templates
• Free HTML Form Templates: Job Application, Survey & Newsletter
• Free HTML & CSS UI Components

Building an admin panel or a web app?

• Gentelella and Adminator: free admin dashboard templates
• DashboardPack: premium dashboards for React, Vue, Angular, Next.js, Laravel and plain HTML

Made by Colorlib.