Meet the Team Template


This code snippet provides a quick and easy way to create a Meet the Team section for your website. It includes four team members, each with their name and job title. This code snippet is perfect for small businesses and organizations that want to quickly get their team members up on the web. It’s easy to customize and will allow your team to be the face of your website.

<section class="py-5">
	<div class="container">
		<div class="row align-items-center">
			<div class="col-lg-6 order-2 order-lg-1">
				<div class="row g-3">
					<div class="col-sm-6">
						<div class="card text-center border-0 bg-light">
							<div class="card-body px-4 py-4">
								<div class="mb-4 mx-2 mx-md-5"><img class="img-fluid rounded-circle" src="https://freefrontend.dev/assets/square.png"></div>
								<h5 class="fw-bold">John Doe</h5>
								<div class="text-muted">
									Programmer
								</div>
							</div>
						</div>
					</div>
					<div class="col-sm-6">
						<div class="card text-center border-0 bg-light">
							<div class="card-body px-4 py-4">
								<div class="mb-4 mx-2 mx-md-5"><img class="img-fluid rounded-circle" src="https://freefrontend.dev/assets/square.png"></div>
								<h5 class="fw-bold">John Doe</h5>
								<div class="text-muted">
									Graphic Designer
								</div>
							</div>
						</div>
					</div>
					<div class="col-sm-6">
						<div class="card text-center border-0 bg-light">
							<div class="card-body px-4 py-4">
								<div class="mb-4 mx-2 mx-md-5"><img class="img-fluid rounded-circle" src="https://freefrontend.dev/assets/square.png"></div>
								<h5 class="fw-bold">John Doe</h5>
								<div class="text-muted">
									Programmer
								</div>
							</div>
						</div>
					</div>
					<div class="col-sm-6">
						<div class="card text-center border-0 bg-light">
							<div class="card-body px-4 py-4">
								<div class="mb-4 mx-2 mx-md-5"><img class="img-fluid rounded-circle" src="https://freefrontend.dev/assets/square.png"></div>
								<h5 class="fw-bold">John Doe</h5>
								<div class="text-muted">
									HR Manager
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
			<div class="col-lg-6 order-1 order-lg-2">
				<div class="ms-lg-5 mb-5">
					<span class="text-muted">Our Team</span>
					<h2 class="display-5 fw-bold mb-3 mb-xl-5">Meet the Team</h2>
					<p class="lead">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Soluta harum ipsum venenatis metus sem veniam eveniet aperiam suscipit.</p>
					<p class="lead">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Soluta harum ipsum venenatis metus sem veniam eveniet aperiam suscipit.</p>
				</div>
			</div>
		</div>
	</div>
</section>
To top