<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css"
integrity="sha512-...your-sha512-hash...==" crossorigin="anonymous" />
/* Adjust the search box width as needed */
<h3>Bootstrap Add Search icon with Search bar</h3>
<div class="input-group search-box">
<input class="form-control" type="search" placeholder="Search" aria-label="Search">
<button class="btn btn-outline-success" type="submit">
<i class="fa fa-search"></i>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>