28 Tailwind CSS landing page templates, both free and paid
Tags: tailwindcss, html, webdev, css
Published: 2022-02-22 18:22:00

*This post was originally posted on [Red Pixel Themes](https://redpixelthemes.com/blog/tailwindcss-landing-page-templates/).*

---

*Note: Some of these links are affiliate links, which means we get compensated in some way if you buy through them.*

## Free templates


![flowbite](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/0ojj2yklafbq6l69jjxu.png)

### Flowbite

[Demo](https://themesberg.github.io/tailwind-landing-page/) | [Get it here](https://github.com/themesberg/tailwind-landing-page)

**Important bits**

* Built with Flowbite
* Includes an optional class based dark mode
* Uses the Tailwind CLI for CSS processing

**Description**

This repository is an example of a responsive landing page built with [Flowbite Blocks](https://flowbite.com/blocks/) based on the Tailwind CSS framework and Flowbite library that you can use for your project.


![driverup](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/uqd9s8tirlxriil78837.png)

### DriverUp

[Get it here](https://github.com/waelhassine/DriverUP-Company?ref=morioh.com&utm_source=morioh.com)

**Important bits**

* Made with Next.js
* Includes 4 pages
* Uses Google Maps

**Description**

This template is specially designed for a taxi driver company that wants something simple but professional.

![Plain template](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/gvd6cjlnf7cg0kkw63qf.jpg)

### Plain

[Demo](https://preview.tailwindtemplates.co/plain/)  |  [Get it here](https://tailwindtemplates.co/templates/plain/)

**Important bits**

- HTML/CSS template
- Uses [Line Icons](https://lineicons.com/)
- Has paid version with more features

**Description**

Plain is a free multipurpose template based on the utility first CSS framework Tailwind. This template is specially crafted for business, portfolio, agency, and corporate websites.

![Treact template](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/elkdy6fooj8cw3pipthw.jpg)

### Treact

[Demo](https://treact.owaiskhan.me/)  |  [Get it here](https://templatana.gumroad.com/l/QaruQ)

**Important bits**

- Uses React and [twin.macro](https://github.com/ben-rogerson/twin.macro)
- Has 7 Landing Page Demos, 8 Inner Pages, and 52 Components
- Free for personal as well as commercial use.

**Description**

Treact is a collection of lightweight and simple-to-setup UI landing pages and components built using TailwindCSS and React.

![SHINE template](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/763n9fz40qh6cl1z10qu.jpg)

### SHINE

[Demo](http://preview.graygrids.com/item/shine-tailwind-css-template/)  |  [Get it here](https://graygrids.com/templates/free-tailwind-template-shine/)

**Important bits**

- HTML/CSS template
- Uses subtle animations
- Has a paid version with more features

**Description**

Shine is a free Tailwind CSS Startup and SaaS Landing Page Template Specially designed for – Startup SaaS, Business, and App Websites.

![Tailwind Starter Kit template](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/3bvjvs0c7psrgno16zyf.jpg)

### Tailwind Starter Kit

[Demo](https://www.creative-tim.com/learning-lab/tailwind-starter-kit/presentation)  |  [Get it here](https://github.com/creativetimofficial/tailwind-starter-kit?ref=creativetim-tailwind-download?ref=landingfolio)

**Important bits**

- Has HTML/CSS, Vue, Angular, and React versions
- Includes 120 Fully Coded CSS elements.
- Provides 4 pages: Homepage, Dashboard, Login, and Profile Page

**Description**

Tailwind Starter Kit is Free and Open Source. It does not change or add any CSS to the already one from TailwindCSS. It features multiple HTML elements and it comes with dynamic components for ReactJS, Vue, and Angular.

![Simple Light template](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/q1m6aozqp8d4f1evs3vi.jpg)

### Simple Light

[Demo](https://simple.cruip.com/)  |  [Get it here](https://github.com/cruip/tailwind-landing-page-template)

**Important bits**

- React template
- Includes design files
- It uses [Vite](https://vitejs.dev/) and SCSS

**Description**

Simple Light is a free landing page template built on top of TailwindCSS and fully coded in React. This template is designed to provide all the basic components a developer needs to create a landing page for SaaS products, online services, and more.

![VPN Landingpage template](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/3kebt4j7qresttx5zp7b.jpg)

### VPN Landingpage

[Demo](https://next-landing-vpn.vercel.app/)  |  [Get it here](https://github.com/naufaldi/next-landing-vpn)

**Important bits**

- Next.js Template
- Uses [React Slick](https://react-slick.neostack.com/docs/api) and [React Scroll](https://www.npmjs.com/package/react-scroll) for some features
- Has a sticky header

**Description**

An Open Source Landingpage For VPN or Apps. Build using NextJS 10 and Tailwind v2.0

![Startup Landingpage template](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/f28rucb8fkt9f93pml4w.jpg)

### Startup Landingpage

[Demo](https://startuptemplate.vercel.app/)  |  [Get it here](https://tomve.gumroad.com/l/startuptemplate)

**Important bits**

- HTML/CSS template
- Has custom made SVGs for the underlines and highlights
- Uses vanilla javascript for interactivity

**Description**

Startup Landingpage is a minimalist landing page built with Tailwind CSS.

## Paid templates

![ecostate](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/pnb7hkctlu9m5p2vd672.png)

### Ecostate Residence

[Demo](https://preview.themeforest.net/item/ecostate-react-single-property-website-template/full_screen_preview/38468954) | Price: $24+ | [Get it here](https://themeforest.net/item/ecostate-react-single-property-website-template/38468954)

**Important bits**

* Made with Gastby and React
* Has no jQuery dependency
* Fully responsive
* Includes Documentation

**Description**

The Ecostate is a single property directory template built with the modern React Gatsby framework.This template is based on the latest version of React (v17.0.2) and Gatsby (v4.13.1) and uses React Hooks throughout. It also includes a blog with complete markdown support and no jQuery dependency. The design is modern and responsive, using tailwindcss.

![rustic](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/1kin5y4h4h9zkm0cinrw.png)

### Rustic

[Demo](https://preview.themeforest.net/item/rustic-react-business-template/full_screen_preview/36345336) | Price: $24+ | [Get it here](https://themeforest.net/item/rustic-react-business-template/36345336)

**Important bits**

* Made with React and Next.js
* Includes 7 pages
* Has no jQuery dependency and it’s fully responsive
* Includes Documentation

**Description**

Rustic is a high-end, modern, and elegant React web template powered by the most recent version of React JS and Next JS. Rustic is an excellent solution to the web designing needs for your website related to creative agency, business, portfolio, corporate, etc. 

![flex](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/bb92xk90he33k7i66by1.png)

### Flex

[Demo](http://preview.themeforest.net/item/flex-modern-multipurpose-tailwind-template/full_screen_preview/34769270) | Price: $19-24.63 | [Get it here](https://themeforest.net/item/flex-modern-multipurpose-tailwind-template/34769270)

**Important bits**

* Has 12 pages including blog, portfolio and case studies pages
* Has 200+ UI elements
* Fully responsive layout

**Description**

Flex is a truly multipurpose template designed to facilitate the needs of businesses from different niches. It offers the collection of all necessary secondary pages for you to build a fully-featured modern website and also includes designs for Blog, Portfolio and case studies to meet all the needs you may have. Move your workflow to a new level with more than 150+ beautifully designed components.


![AppWind template](https://redpixelthemes.com/cachedImages/appwind-i1BxbXU9O8-768w.webp)

### AppWind

[Demo](https://app-tailwind.preview.uideck.com/) | Price: $19-36 |  [Get it here](https://graygrids.com/templates/appwind-tailwind-css-app-landing-page-template/)

**Important bits**

- Has React and Vue.js versions
- Includes a dark mode
- Includes 8 pages

**Description**

AppWind is a landing page template based on Tailwind CSS designed for app and software websites. AppWind comes with all essential sections, components, and features for your upcoming project. This Tailwind template has both light mode and dark mode with a switcher option.

![Techwind template](https://redpixelthemes.com/cachedImages/techwind-0LvDATqECp-768w.webp)

### Techwind

[Demo](https://preview.themeforest.net/item/techwind-tailwind-css-multipurpose-landing-template/full_screen_preview/37847929?_ga=2.29572540.2013054838.1654566928-2068169371.1561483893&_gac=1.249768564.1651860332.CjwKCAjwjtOTBhAvEiwASG4bCDfYoDGx-mwXIo9kz2LLrSqn29Y1_Q-TDi1QX06Sh-x5RkwvY_q7ARoCQwIQAvD_BwE) | Price: $12  |  [Get it here](https://themeforest.net/item/techwind-tailwind-css-multipurpose-landing-template/37847929?irgwc=1&clickid=09qQ0U0MmxyNTtHW4dS0RyTIUkD3glXv9VosTs0&iradid=275988&irpid=2662107&iradtype=ONLINE_TRACKING_LINK&irmptype=mediapartner&mp_value1=&utm_campaign=af_impact_radius_2662107&utm_medium=affiliate&utm_source=impact_radius)

**Important bits**

- Includes 20+ different Landing Pages and 60+ Inner Pages
- Has a dark mode
- Has no jQuery dependency

**Description**

Techwind is a Powerful App, Saas & Software Tailwind CSS Multipurpose Landing Page Template. It is a beautifully handcrafted, pixel-perfect HTML5 landing page template based on the latest Tailwind CSS v3.x.

![Appy template](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/e2h0pwzkl3s7331pacwa.jpg)

### Appy

[Demo](https://cruip.com/demos/appy/) | Price: $39  |  [Get it here](https://cruip.com/appy/?ref=redpixel)

**Important bits**

- Has dark mode
- HTML/CSS, React and Vue versions are available
- Has 8 pages: Homepage, About, Blog, Blog post, testimonials, help center, 404, and Contact.

**Description**

Appy is the ultimate mobile-based landing page template built on top of the latest Tailwind CSS 2.0 framework. Along with the toggle to switch between dark and white layouts, it introduces lots of new flexible elements you can use across websites and marketing landing pages. Appy contains 8 pre-made pages, dozens of pre-built sections, and several options that will help you to kickstart your project’s development with ease.

![Nemo template](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/h4nl2msj5g7pmnpgwa2u.jpg)

### Nemo

[Demo](https://www.wickedtemplates.com/viewports/nemo.html) | Price: $29  |  [Get it here](https://gumroad.com/a/363746419/ybqpM)

**Important bits**

- HTML/CSS template
- Uses Alpine.js for interactivity
- Has 6 pages: Homepage, About, Blog, Blog post, Pricing and help center

**Description**

Nemo is a minimalist landing page built with Tailwind CSS.

![Noir template](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/z5xd3uoj9709hk82iib7.jpg)

### Noir

[Demo](https://www.wickedtemplates.com/viewports/noir.html) | Price: $29  |  [Get it here](https://gumroad.com/a/363746419/ybqpM)

**Important bits**

- HTML/CSS and Next.js versions are available
- Uses Alpine.js for interactivity
- Has beautiful typography

**Description**

Noir is a minimalist landing page built with Tailwind CSS.

![Monotone template](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/cspdgypgqnjfk83hz8sg.jpg)

### Monotone

[Demo](https://www.wickedtemplates.com/viewports/monotone-starter.html) | Price: $29  |  [Get it here](https://wicked-templates.gumroad.com/l/monotone-starter)

**Important bits**

- Includes dark mode
- Has 20+ components and 20+ components
- Has 4 pages: Homepage, Blog, Blog post, and Pricing.

**Description**

Monotone is built with the latest version of Tailwind CSS and is using a lightweight JavaScript framework (Alpine.js)

![Travelia template](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/semdf22urizy34yhedd9.jpg)

### Travelia

Price: $13 -$18 |  [Get it here](https://tailwinduikit.com/templates/travelia-landing-page)

**Important bits**

- One page design
- Both HTML and Vue versions are available
- Meets WCAG accessibility guidelines

**Description**

Travelia is the ideal travel and tourism website. It has a refreshing, clean look and amazing design features and will definitely pull traffic to your brand.

![Prodify template](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/dvtd3rjjj0bg2dphdowp.jpg)

### Prodify

Price: $13-45 | [Get it here](https://tailwinduikit.com/templates/prodify-modern-product-website)

**Important bits**

- Available in HTML, Vue, React, and Angular versions
- Has 6 pages: Homepage, About us, Pricing, Knowledge base, Knowledge base inner page, Knowledge base single article
- Meets WCAG accessibility guidelines

**Description**

Prodify is a modern, sleek website that can be used by anyone to market a product and/or service. With its unique design, Prodify focuses on the growing trends of beautiful gradients and clean, large typography.

![Foodies foodies](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/p3be8xaarr5ko4s6yc58.jpg)

### Foodies

Price: $13-45 | [Get it here](https://tailwinduikit.com/templates/foodies-website)

**Important bits**

- Available in HTML, Vue, React, and Angular versions
- One page design
- Meets WCAG accessibility guidelines

**Description**
Foodies is an innovative, sleek website that could prove to be a game-changer for a restaurant or food delivery service. An appealing and stunning design ensures foodies stand out from their competitors.

![Pivot template](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/kr22ornfupnb1b2cxp8z.jpg)

### Pivot

Price: $13-18 | [Get it here](https://tailwinduikit.com/templates/pivot-product-landing-page)

**Important bits**

- Available in HTML, Vue, and React versions
- One page design
- Meets WCAG accessibility guidelines

**Description**

Pivot is a powerful, high-tech website useful to anyone looking to market a financial management business. With a unique dashboard and stunning visual Pivot will be a favorite for every user.

![Inertia template](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/djzsgd1kv7cqcvvz899n.jpg)

### Inertia

Price: $13-18 | [Get it here](https://tailwinduikit.com/templates/inertia-landing-page)

**Important bits**

- Available in HTML, Vue and React versions
- One page design
- Meets WCAG accessibility guidelines

**Description**

Inertia is a modern and unique website with an aesthetic design. Practically it can be best utilized by insurance companies looking to achieve a sleek, innovative look.

![Radian template](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/n24io40lg50r94vakkoz.jpg)

### Radian

Price: $13-45 | [Get it here](https://tailwinduikit.com/templates/radian-architecture-website)

**Important bits**

- Available in HTML, Vue, React, and Angular versions
- One page design
- Meets WCAG accessibility guidelines

**Description**

Radian is a state-of-the-art website with a bold and modern design. It is of best use to architecture firms looking to display their incredible portfolio as radian helps achieve an excellent modern look.

![Fast Delivery template](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/37aujmy0ddqt7lopspp3.jpg)

### Fast Delivery

[Demo](https://www.themes.dev/library/tailwindcss-landing-page-services/#details) | Price: $9 | [Get it here](https://themes.lemonsqueezy.com/checkout?cart=7944213f-435f-44b8-b01b-551651efd130)

**Important bits**

- HTML/CSS template
- Uses hero icons
- Uses jQuery for interactivity

**Description**

Fast Delivery is a minimalist landing page built with Tailwind CSS.

![SaasFolio template](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/hr9i4xdfwhr9ern1xed6.jpg)

### SaasFolio

[Demo](https://www.landingkit.com/templates/saasfolio/tailwind/) | Price: $29 | [Get it here](https://www.landingfolio.com/templates/products/saasfolio)

**Important bits**

- Available in Bootstrap & Tailwind CSS versions
- Has 5 pages: Homepage, Feature, Pricing, Login, and Signup
- All HTML files are W3C Valid

**Description**

SaasFolio is a conversion-optimized landing page template for SaaS and Startups. It differences itself from other templates, by focussing on strong sales copy.

![Clarity UI template](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/myj8f2ytycu6g27j1j5l.jpg)

### Clarity UI

[Demo](https://rareblocks.xyz/api/template/preview/61b5c29986328e8557b61a91?ref=landingfolio) | Price: $59  |  [Get it here](https://www.landingfolio.com/templates/post/rareblocks)

**Important bits**

- HTML/CSS template
- Includes 90+ components

**Description**

ClarityUI is a minimalistic UI kit with over 90 components for your landing page, fully build using TailwindCSS. This UI kit adapts itself very well and fits into any design project instantly with minimal need for style changes.

![Dorsin template](https://redpixelthemes.com/cachedImages/dorsin-d7MZtaJ5Qa-768w.webp)

### Dorsin

[Demo](https://preview.themeforest.net/item/dorsin-tailwind-css-landing-page-template/full_screen_preview/35996212?_ga=2.54774509.79831694.1650741115-2068169371.1561483893) | Price: $14  |  [Get it here](https://themeforest.net/item/dorsin-tailwind-css-landing-page-template/35996212?irgwc=1&clickid=09qQ0U0MmxyNTtHW4dS0RyTIUkD3gnTX9VosTs0&iradid=275988&irpid=2662107&iradtype=ONLINE_TRACKING_LINK&irmptype=mediapartner&mp_value1=&utm_campaign=af_impact_radius_2662107&utm_medium=affiliate&utm_source=impact_radius)

**Important bits**

- HTML/CSS template
- 9 different home pages + sign-up, login and forgot password pages.
- No jQuery dependency

**Description**

Dorsin is a fully responsive landing page template, has 9 different types of layouts which are quite enough for your business. You can simply update its contents, images, and CSS according to your company info.