Single Plan Pricing Table


This code snippet from FreeFrontend.dev provides a single plan pricing table for showcasing a single product or service. The table includes a detailed description of the product or service, a list of features, and a call-to-action button to prompt customers to take action. This is a great way to present a product or service in a professional and organized manner.

<section class="py-5">
	<div class="container">
		<div class="row justify-content-between">
			<div class="col-md-6 col-lg-4 pt-2 mt-5">
				<span class="text-muted">Pricing Table</span>
				<h2 class="display-5 fw-bold">Our Pricing</h2>
				<p class="lead">Lorem ipsum dolor sit amet consectetur adipisicing vel eligendi necessitatibus quos voluptates doloribus at itaque placeat fuga Repellendus saepe placeat eveniet culpa vel eligendi necessitatibus quos voluptates</p>
			</div>
			<div class="col-md-6 col-lg-5 mt-md-0 mt-5">
				<div class="card text-center border-0">
					<div class="card-body bg-light py-5">
						<div class="mb-3 mx-auto">
							<svg class="bi bi-magic" fill="currentColor" height="48" viewbox="0 0 16 16" width="48" xmlns="http://www.w3.org/2000/svg">
							<path d="M9.5 2.672a.5.5 0 1 0 1 0V.843a.5.5 0 0 0-1 0v1.829Zm4.5.035A.5.5 0 0 0 13.293 2L12 3.293a.5.5 0 1 0 .707.707L14 2.707ZM7.293 4A.5.5 0 1 0 8 3.293L6.707 2A.5.5 0 0 0 6 2.707L7.293 4Zm-.621 2.5a.5.5 0 1 0 0-1H4.843a.5.5 0 1 0 0 1h1.829Zm8.485 0a.5.5 0 1 0 0-1h-1.829a.5.5 0 0 0 0 1h1.829ZM13.293 10A.5.5 0 1 0 14 9.293L12.707 8a.5.5 0 1 0-.707.707L13.293 10ZM9.5 11.157a.5.5 0 0 0 1 0V9.328a.5.5 0 0 0-1 0v1.829Zm1.854-5.097a.5.5 0 0 0 0-.706l-.708-.708a.5.5 0 0 0-.707 0L8.646 5.94a.5.5 0 0 0 0 .707l.708.708a.5.5 0 0 0 .707 0l1.293-1.293Zm-3 3a.5.5 0 0 0 0-.706l-.708-.708a.5.5 0 0 0-.707 0L.646 13.94a.5.5 0 0 0 0 .707l.708.708a.5.5 0 0 0 .707 0L8.354 9.06Z"></path></svg>
						</div>
						<h5 class="fw-bold">Standard</h5>
						<div>
							For Teams
						</div>
						<div class="display-3 fw-bold mt-4 text-primary">
							$19
						</div>
						<div class="fw-bold">
							Monthly
						</div>
						<ul class="list-unstyled mt-4">
							<li class="mb-3">1 Domain</li>
							<li class="mb-3">1,000 Visitors</li>
							<li class="mb-3">24/7 Support</li>
						</ul><a class="btn btn-primary btn-lg mt-4" href="">Learn more</a>
					</div>
				</div>
			</div>
		</div>
	</div>
</section>
To top