gentelella
Version:
Gentelella v4 — free admin template. 60 pages, 20 chart variants, fully interactive inbox & kanban, live theme generator, component playground, PWA-ready. Vite 8, vanilla JS, no Bootstrap, no jQuery.
82 lines (74 loc) • 4.45 kB
HTML
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Pricing | Gentelella 2026 v4</title>
<link rel="icon" href="../images/favicon.svg" type="image/svg+xml">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet">
<script type="module" src="/src/main-v4.js"></script>
</head>
<body data-shell="admin" data-page="pricing" data-breadcrumb="Home > Pricing">
<main class="main">
<div class="page-wrapper">
<div class="page-header">
<div class="page-header-row">
<div>
<div class="page-pretitle">Plans</div>
<h1 class="page-title">Pricing</h1>
</div>
<div class="page-actions">
<div class="chart-tabs">
<button class="chart-tab active">Monthly</button>
<button class="chart-tab">Annual <span style="margin-left:4px;color:var(--green);font-weight:600">−20%</span></button>
</div>
</div>
</div>
</div>
<div class="row col-3">
<div class="pricing-tier">
<div class="name">Starter</div>
<div><span class="price">$0</span><small>/month</small></div>
<div class="desc">Everything you need to evaluate the platform on a small project.</div>
<ul>
<li><svg viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 8l3 3 7-8"/></svg> Up to 3 users</li>
<li><svg viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 8l3 3 7-8"/></svg> 5 GB storage</li>
<li><svg viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 8l3 3 7-8"/></svg> Community support</li>
<li><svg viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 8l3 3 7-8"/></svg> Core dashboards</li>
</ul>
<button class="btn btn-outline" style="justify-content:center;height:36px">Get started</button>
</div>
<div class="pricing-tier popular">
<div class="name">Pro</div>
<div><span class="price">$29</span><small>/user / month</small></div>
<div class="desc">For growing teams that need more power, integrations, and reporting.</div>
<ul>
<li><svg viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 8l3 3 7-8"/></svg> Unlimited users</li>
<li><svg viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 8l3 3 7-8"/></svg> 100 GB storage</li>
<li><svg viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 8l3 3 7-8"/></svg> Priority email support</li>
<li><svg viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 8l3 3 7-8"/></svg> Advanced reporting</li>
<li><svg viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 8l3 3 7-8"/></svg> 50+ integrations</li>
<li><svg viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 8l3 3 7-8"/></svg> SSO via Google / GitHub</li>
</ul>
<button class="btn btn-primary" style="justify-content:center;height:36px">Start 14-day trial</button>
</div>
<div class="pricing-tier">
<div class="name">Enterprise</div>
<div><span class="price">Custom</span></div>
<div class="desc">Dedicated infrastructure, audit logs, and a named CSM.</div>
<ul>
<li><svg viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 8l3 3 7-8"/></svg> Everything in Pro</li>
<li><svg viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 8l3 3 7-8"/></svg> SAML / SCIM</li>
<li><svg viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 8l3 3 7-8"/></svg> SOC 2 + DPA</li>
<li><svg viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 8l3 3 7-8"/></svg> Dedicated success mgr</li>
<li><svg viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 8l3 3 7-8"/></svg> 99.99% SLA</li>
</ul>
<button class="btn btn-outline" style="justify-content:center;height:36px">Talk to sales</button>
</div>
</div>
</div>
</main>
</body>
</html>