Preline UI

Introduction

Preline UI is a free, open-source set of UI components built with Tailwind CSS. Preline UI also offers 350+ premium components that are compatible with React, Vue, and HTML.

Features

Preline UI library offers the following features:

• Supports dark mode

• 185+ free components

• Compatible with React, Vue, and HTML

• Open source version has 750+ Free components & examples available
  

• Pro version offers 350+ starter pages and examples

Open Source Components

Preline UI (free-version) provides essential landing page components to build multipurpose websites.

Landing Page Components

• Hero Sections

• Hero Forms

• Icon Sections

• Pricing Sections

• FAQ Sections

• Blog Sections

• Blog Articles

• Team Sections

• Testimonials

• Masonry Sections

• Features: General

• Features: Navs

• Features: Stats

• Announcement Banners

• Card Sections

• Clients Sections

• Galleries

• Basic layouts

• 404

• Contacts

• Footers

Pre-Built Pages

• Pricing

• Admin, Dashboard

Overlays

• Modals

• Cookie Banners

Navigations

• Navbars (Headers)

• Mega Menu

Forms

• Authentication

• Feedback

• Subscribe

Admin Components

• Application

• Navbars

• Invoice

• Tables

• Stats

• Form Layouts

• AI Prompts

Pro Components

Preline UI (paid version) provides essential landing page components to build multipurpose websites.

• Charts & Graphs

• Interactive Data Cards

• Data Cards

• Data Maps

• Stats

• Cards (Single List Item)

• Cards (Single Grid Item)

• Stacked Layout

• Grid Layout

• Masonry Layout

• Card Navs

• Drawers (Offcanvas)

• General

• Share & Invite

• Billing & Payments

• Add/Create Forms

• Edit Forms

• Data Management

• Feedback

• Date & Time

• Sidebar Search

• Command Palettes

• List Group

• Description Lists

• Timeline (Feeds)

• System Logs

• Pricing & Plans

• Payments

• User Profiles

• Import data

• Export data

• Notification Systems

• Checkout Forms

• Dropdowns

• Selects

• Quick Actions

• Buttons

• Button Groups

• Badges

• Tables (Projects)

• Tables (Products)

• Tables (Users)

• Tables (Orders)

• Forms (General)

• File Uploads

• Layouts

• Switches

• Radio & Checkbox Groups

• Textarea Input

• Calendars

• Sidebars

• User Schedule

• Months

• Chat Bubbles

• Chat Widgets

• Reviews

• Empty States

• Title Bars

• Section Filter Bars

• Navs

• Authentication

• Headers (Dashboard Layouts)

• Stacked Layouts (Dashboard Layouts)

• Demo Stacked Layouts

• Sidebar Contents (Dashboard Layouts)

• Multi Column Layouts

• Detached Sidebar

• Demo Dashboard Layouts

• Footer (Dashboard Layouts)

Pros and Cons

Pros ✅

• Comes with free Figma Design System as well.

• You might not get Data Maps and AI Prompt components anywhere else.

• Regular updates

• Well documented

• 570+ total components and elements available
  

• Framework integration guides available

• 10+ templates available in Preline UI Pro

Cons ⛔️

• The Preline UI Figma design system does not include design versions of Preline UI components, even for the pro components.

FAQ

What is the difference between open source and pro versions?

The open source version of Preline is free and offers basic UI components, while the Pro version provides advanced examples, demos, and additional features for a more comprehensive development experience.