Bootstrap Icons   is a free, high quality, open source icon library with nearly 1,200 icons. Include them anyway you like SVGs, SVG sprite, or web fonts.
 
										
									 
									
									
									
										
										
										 
										
										
										
										
										
										
										
										
										
											
											
												copy 
												
													
<i class="bi bi-bookmarks-fill fs-2x"></i>
<i class="bi bi-calendar-check fs-2x"></i>
<i class="bi bi-check2-square fs-2x"></i>
<i class="bi bi-diagram-3 fs-2x"></i>
<i class="bi bi-gear fs-2x "></i>
<i class="bi bi-circle-square fs-2x"></i>
<i class="bi bi-graph-down fs-2x"></i>
<i class="bi bi-vector-pen fs-2x"></i>
 
												 
											 
											
										 
										
									 
									
									
									
										
										
										 
										
										
										The inline icons can be colored using
										.text-{color}class that defined with
										$theme-text-colorsvariable in
										sass/_variables.scss:
										
										
										
										
										
										
											
											
												copy 
												
													
<i class="bi bi-droplet-half text-white"></i>
<i class="bi bi-droplet-half text-primary"></i>
<i class="bi bi-droplet-half text-secondary"></i>
<i class="bi bi-droplet-half text-light"></i>
<i class="bi bi-droplet-half text-success"></i>
<i class="bi bi-droplet-half text-info"></i>
<i class="bi bi-droplet-half text-warning"></i>
<i class="bi bi-droplet-half text-danger"></i>
<i class="bi bi-droplet-half text-dark"></i>
<i class="bi bi-droplet-half text-muted"></i>
<i class="bi bi-droplet-half text-gray-100"></i>
<i class="bi bi-droplet-half text-gray-200"></i>
<i class="bi bi-droplet-half text-gray-300"></i>
<i class="bi bi-droplet-half text-gray-400"></i>
<i class="bi bi-droplet-half text-gray-500"></i>
<i class="bi bi-droplet-half text-gray-600"></i>
<i class="bi bi-droplet-half text-gray-700"></i>
<i class="bi bi-droplet-half text-gray-800"></i>
<i class="bi bi-droplet-half text-gray-900"></i>
 
												 
											 
											
										 
										
									 
									
									
									
										
										
										 
										
										
										The font icons can be sized using
										.fs-{size}class that defined with
										$font-sizesvariable in
										sass/_variables.scss
										
										
										Where
										
sizeis one of:
										
											
											1- sets icon size that equals to
											<h1>font size 
											
											2- sets icon size that equals to
											<h2>font size 
											
											3- sets icon size that equals to
											<h3>font size 
											
											4- sets icon size that equals to
											<h4>font size 
											
											5- sets icon size that equals to
											<h5>font size 
											
											6- sets icon size that equals to
											<h6>font size 
											
											7- sets icon size that equals to
											<h7>font size 
											
											7- sets icon size that equals to
											0.95 of $font-size-basewhere
											$font-size-base: 1rem 
											
											8- sets icon size that equals to
											0.85 of $font-size-basewhere
											$font-size-base: 1rem 
											
											9- sets icon size that equals to
											0.75 of $font-size-basewhere
											$font-size-base: 1rem 
											
											10- sets icon size that equals to
											0.5 of $font-size-basewhere
											$font-size-base: 1rem 
											
											base- sets icon size that equals to
											$font-size-basewhere
											$font-size-base: 1rem 
											
											fluid- sets icon size that equals to
											100% 
											
											2x- sets icon size that equals to
											2 of $font-size-basewhere
											$font-size-base: 1rem 
											
											2qx- sets icon size that equals to
											2.25 of $font-size-basewhere
											$font-size-base: 1rem 
											
											2hx- sets icon size that equals to
											2.5 of $font-size-basewhere
											$font-size-base: 1rem 
											
											2tx- sets icon size that equals to
											2.75 of $font-size-basewhere
											$font-size-base: 1rem 
											
											3x- sets icon size that equals to
											3 of $font-size-basewhere
											$font-size-base: 1rem 
											
											3qx- sets icon size that equals to
											3.25 of $font-size-basewhere
											$font-size-base: 1rem 
											
											3hx- sets icon size that equals to
											3.5 of $font-size-basewhere
											$font-size-base: 1rem 
											
											3tx- sets icon size that equals to
											3.75 of $font-size-basewhere
											$font-size-base: 1rem 
											
											4x- sets icon size that equals to
											4 of $font-size-basewhere
											$font-size-base: 1rem 
											
											4qx- sets icon size that equals to
											4.25 of $font-size-basewhere
											$font-size-base: 1rem 
											
											4hx- sets icon size that equals to
											4.5 of $font-size-basewhere
											$font-size-base: 1rem 
											
											4tx- sets icon size that equals to
											4.75 of $font-size-basewhere
											$font-size-base: 1rem 
											
											5x- sets icon size that equals to
											5 of $font-size-basewhere
											$font-size-base: 1rem 
											
											5qx- sets icon size that equals to
											5.25 of $font-size-basewhere
											$font-size-base: 1rem 
											
											5hx- sets icon size that equals to
											5.5 of $font-size-basewhere
											$font-size-base: 1rem 
											
											5tx- sets icon size that equals to
											5.75 of $font-size-basewhere
											$font-size-base: 1rem 
										 
											
											
												copy 
												
													
<i class="bi bi-droplet-half fs-5x"></i>
<i class="bi bi-droplet-half fs-4x"></i>
<i class="bi bi-droplet-half fs-3x"></i>
<i class="bi bi-droplet-half fs-2tx"></i>
<i class="bi bi-droplet-half fs-2hx"></i>
<i class="bi bi-droplet-half fs-2qx"></i>
<i class="bi bi-droplet-half fs-2x"></i>
<i class="bi bi-droplet-half fs-1"></i>
<i class="bi bi-droplet-half fs-2"></i>
<i class="bi bi-droplet-half fs-3"></i>
<i class="bi bi-droplet-half fs-5"></i>
<i class="bi bi-droplet-half fs-6"></i>