30+ Best Free Pricing Table Templates in 2026 (HTML/CSS, Figma & PSD)

Pricing tables have to present several pieces of information in a small section: plan names, prices, billing periods, feature differences, and a clear call to action. A good template gives you a tested structure that you can adapt to a SaaS product, hosting service, membership site, app, or client project.

This collection includes 40 free pricing table templates for HTML/CSS, Bootstrap, Tailwind CSS, Figma, PSD, Sketch, Illustrator, CodePen, and Adobe XD. The resources range from browser-ready pricing sections to editable UI design files for SaaS products, hosting plans, memberships, services, and other tiered pricing pages.

For the surrounding page design, see our free landing page templates, web UI kits, and web button templates.

Last Updated: September 3, 2026

Quick Picks

Resource	Format
Bootstrap 5.3 Pricing Example	HTML/CSS
Tailwind CSS Pricing Components	HTML + Tailwind CSS
Figma Pricing Template	Figma
Pricing Tables UI Component	Figma
Free PSD Pricing Table	PSD
Pricing Cards UI Design	Sketch

HTML & CSS Pricing Table Templates
Figma Pricing Table Templates
PSD Pricing Table Templates
Sketch & Illustrator Pricing Table Templates
Adobe XD Pricing Table Templates

HTML & CSS Pricing Table Templates

Bootstrap 5.3 Pricing Example

The official Bootstrap pricing example uses three plan cards and a feature-comparison table for SaaS, service, and subscription pages.

Tailwind CSS Pricing Components

Two Tailwind CSS pricing layouts with plan cards, feature lists, and responsive layouts.

Pricing Card Design

A three-tier pricing component with a monthly and annual billing switch.

Pricing Table With Toggle Button

A pricing table with a toggle for switching billing options.

Pricing Table With Hover Effect

A compact pricing table with a hover effect.

Pure HTML + CSS Pricing Table

A pure HTML and CSS pricing table with no JavaScript.

Figma Pricing Table Templates

Figma Pricing Template

Pricing components built with Figma variables, price labels, feature lists, and CTA buttons.

Plans & Pricing Template

An editable plans and pricing section that can be copied into another Figma project.

Hero Pricing Template for Figma

A minimal pricing page template that uses Figma Auto Layout.

Pricing Table & Pricing Plan Template

A clean pricing-plan layout created for payment and subscription pages.

Nice Pricing Table Page Template

A flat pricing page with multiple service or product tiers and editable Figma elements.

Pricing Tables UI Component

A set of reusable Figma pricing-table UI components.

PSD Pricing Table Templates

Free PSD Pricing Table

Two editable Photoshop pricing-table styles with vector icons and Google Fonts.

Hosting Pricing Table PSD Template

A hosting-focused pricing table with multiple service plans.

Pricing Table PSD Free

A clean PSD pricing table with a simple multi-plan layout.

Pricing Page PSD + AI

An e-commerce pricing page available in PSD and Illustrator formats.

3 Freebie Pricing Tables

A layered pricing-table design in blue and orange color versions.

Pricing Tables Freebie

A multi-plan pricing table for Photoshop.

Free Website Pricing Table PSD

A website pricing table with vertical and horizontal layout options.

Minimal Pricing Table PSD

A dark minimal pricing-table design for Photoshop.

Pricing Freebie PSD

A layered PSD pricing table with multiple plan columns.

Pricing Tables Free PSD

A Retina-ready pricing-table component in PSD format.

Cars Pricing Table PSD

A clean pricing layout originally designed for car plans and packages.

Freebie Pricing Tables PSD

A traditional multi-column pricing-table PSD.

Free Pricing Table PSD

A four-column pricing-table PSD.

Free Clean and Simple Pricing Tables

A clean set of editable Photoshop pricing tables.

Geometric Pricing Tables PSD

Geometric pricing tables with PSD and PNG files.

Sketch & Illustrator Pricing Table Templates

Pricing Cards UI Design

A desktop pricing-card layout for Sketch.

Pricing Table Vector Freebie

A clean Illustrator pricing table with editable vector artwork.

Pricing Page Template for Sketch

A pricing-page design for Sketch.

6 Minimal Pricing Tables for Sketch

Six minimal pricing-table designs for Sketch.

Pricing Table Sketch

A simple pricing table for Sketch.

Vector Pricing Tables Design

Three layered vector pricing-table designs for Adobe Illustrator.

Adobe XD Pricing Table Templates

Adobe XD is in maintenance mode. These templates are mainly useful for projects that already use XD files.

Price Table for Web

A pricing-table design with light and dark versions for Adobe XD.

Pricing Plan UI

A clean Adobe XD pricing-plan layout.

Free Price Page for Adobe XD

A pricing-page template for Adobe XD.

FAQs

Q: Which formats are included in this pricing table collection?

A: The collection includes HTML/CSS, Bootstrap, Tailwind CSS, CodePen, Figma, PSD, Sketch, Illustrator, and Adobe XD resources.

Q: Which pricing table templates can I use directly on a website?

A: Start with the HTML/CSS section. It includes plain HTML/CSS, Bootstrap 5, Tailwind CSS, and CodePen examples with editable source code. Figma, PSD, Sketch, Illustrator, and XD files are design assets that need to be implemented separately.

Q: Can I use these pricing table templates for commercial projects?

A: License terms vary by creator and source. Check the original download page before using a template in a commercial or client project.

Q: Which format is best for a SaaS pricing page?

A: HTML/CSS, Bootstrap, and Tailwind CSS entries are useful when you are building the live page. Figma works well during product design and handoff. PSD and Sketch files are useful when an existing project already uses those file formats.