Playground

PLATFORM

Tails

Create websites with TailwindCSS
Wave

Start building the next great SAAS
Pines

Alpine & Tailwind UI Library
Auth

Plug'n Play Authentication for Laravel
Designer comingsoon

Create website designs with AI
DevBlog comingsoon

Blog platform for developers
Static

Build a simple static website
SaaS Adventure

21-day program to build a SAAS

COMMUNITY

An Alpine & Tailwind UI Library

Pines is a library of animations, sliders, tooltips, accordions, modals, and more! It's a set of UI elements that can be copy and pasted into any Alpine and Tailwind projects.

View The Elements ViewonGithub

Pines is a UI library built for AlpineJS and TailwindCSS.

Add AlpineJS and TailwindCSS to your page and then copy and paste any of these elements into your project.

Absolutely! Pines works with any other library or framework. Pines works especially well with the TALL stack.

Button

Toggle Switch

My Account

Profile⇧⌘P

Billing⌘B

Settings⌘S

Keyboard shortcuts⌘K

Team

New Team ⌘+T

GitHub

Support

Log out⇧⌘Q

Product Name

This card element can be used to display a product, post, or any other type of data.

This is the content body inside of the first tab. This is the content body inside of the second tab.

00:00 00:00

My Account

Profile⇧⌘P

Billing⌘B

Settings⌘S

Keyboard shortcuts⌘K

Team

New Team ⌘+T

GitHub

Support

Log out⇧⌘Q

No additional baggage included

Break free from the burden of adding another library.

All you need is Alpine and Tailwind and you're good to go!
Learn why we built it this way, by diving into the docs.

How to use

            <!-- Include the Alpine library on your page -->
<script src="//unpkg.com/alpinejs" defer></script>

<!-- Include the TailwindCSS library on your page -->
<script src="https://cdn.tailwindcss.com"></script>

Then, copy and paste any element into your page and it will work like magic.

View The Docs ViewonGithub

Easy to add to any project

Copy'n Paste elements that feel so right!

Add a delightful user experience to your applications with these beatifully crafted elements. Integrating these into your project is as simple as copy and paste!