Tailwind

Tailwind posts, videos, courses, and more

TechvBlogs · 1 year ago

How to Install Tailwind CSS 3 in Laravel 9 With Vite 3

Tailwind is a modern CSS framework. It is a utility-first-based framework and provides you with a unique set of utility classes which makes the development process very easy and results in m...
5

TechvBlogs · 1 year ago

How to setup Tailwind CSS in Vue 3

Tailwind CSS is one of the newest and coolest utility libraries on the block, and it lets you build UI components with ease. Here’s a quick guide on how to set up Tailwind in your Vue 3 proj...
6

TechvBlogs · 2 years ago

How to use Tailwind CSS with a React App

What is Tailwind CSS? Tailwind is a modern CSS framework. It is a utility-first-based framework and provides you with a unique set of utility classes which makes the development process very...
4

Avneesh Agarwal · 2 years ago

How to make a sponsors site with Next.js, Tailwind CSS, and Stripe 💵

Hello everyone, ever thought of creating a site that can allow you to accept sponsors? Let's build a site to accept sponsors, today! Setup Setting up Next.js app I am going to use Tailwind C...
4

Shreya · 2 years ago

How to setup Tailwind in your project

Tailwind is a utility-first framework consisting of various classes to help you build clear and responsive designs fast inside HTML markup file. In this post, you will learn how to set up ta...
5

Avneesh Agarwal · 2 years ago

Create an animated sidebar with TailwindCSS in React💫

Hey everyone, in many apps you need a sidebar/drawer which slides in if you click on a hamburger icon. In this tutorial, we are going to see how to build that 🌟. Demo {% loom b748e5d32ebd45...
5

Avneesh Agarwal · 2 years ago

TailwindCSS v3 released! A look at the new features 🎨

Intro Tailwind CSS v3.0 just got released and they have added a lot of cool features, so let's have a look at them. JIT is now inbuilt The JIT mod is now inbuilt in TailwindCSS so it is way...
5

Avneesh Agarwal · 2 years ago

Build a quiz App with Next.js and TailwindCSS!

Hey guys, this is gonna be a tutorial plus a challenge. I also have a giveaway at the end so stay tuned ;) Demo Video Demo You can try it out yourself here- https://quiz-challenge.vercel.app...
5

Marc Garcia · 2 years ago

Laravel Tailwind Boilerplate and Vue ready

Happy Friday!! This week I was working with a simple GitHub repo to save me time when I start new Laravel projects. The repo it's called Laravel Tailwind Boilerplate & Vue ready It consi...
4

Tony Lea · 2 years ago

TailwindCSS 2.2 in 22 seconds

Want to learn what's new in TailwindCSS 2.2 in 22 seconds? Maybe that's a little too ambitious 🤪. It might be more like 122 seconds. Either way, in this tutorial, you will learn the new thi...
13

Savio Martin · 2 years ago

Create a Dark Mode toggler with Tailwind ⚡️

Hello Folks 👋 This is Savio here. I'm young dev with an intention to enhance as a successful web developer. I love building web apps with React. I have proved my superiority in frontend tec...
4

Savio Martin · 2 years ago

Set Up Tailwind JIT In React - The fastest way! 🚀

Hello Folks 👋 This is Savio here. I'm young dev with an intention to enhance as a successful web developer. I love building web apps with React. I have proved my superiority in frontend tec...
5

Savio Martin · 2 years ago

Set Up Tailwind In React - The fastest way! 🚀

Hello Folks 👋 This is Savio here. I'm young dev with an intention to enhance as a successful web developer. I love building web apps with React. I have proved my superiority in frontend tec...
5

Tony Lea · 2 years ago

Extracting TailwindCSS from HTML

I've recently run into a scenario where I want to design a one-off page using TailwindCSS with the CDN link; however, including the CDN link would mean that my page load is a heavy 3MB 🙁. I...
7

Tony Lea · 3 years ago

TailwindCSS Hidden Gems 💎

If you are new to TailwindCSS, you're probably familiarizing yourself with some of the utility classes and starting to build some awesome stuff. 😉 As you learn about this awesome framework,...
7

Riccardo Battiato · 3 years ago

Tailwind CSS - all you need to know to get started

Tailwind CSS is a relatively new CSS framework that can be easily seen as the next big revolution of the way we style our HTML elements. Tailwind encourages and facilitates a utility-first a...
4

Tony Lea · 3 years ago

Tracing Objects in TailwindCSS

I've been getting good at designing and painting elements on the page using TailwindCSS. I decided to use a flat laptop image 🖼️ and design it with TailwindCSS. It was actually pretty simple...
9

Tony Lea · 3 years ago

Custom Animations in TailwindCSS

Tailwind provides some simple animations out of the box. If you're not familiar with these animations, be sure to check out my post on TailwindCSS Animations here. These simple animations ar...
7

Tony Lea · 3 years ago

5 reasons to start using TailwindCSS

It's 2021, and it's time for a change. Bootstrap has held its reign as the top CSS framework for quite some time; however, that's all about to change. TailwindCSS is the cat's pajamas, it's...
9

Tony Lea · 3 years ago

Creating Browser Mockups in TailwindCSS

TailwindCSS gives us the ability to create some really cool designs. It also gives us the power to create some cool elements on our page, such as browser mockups. You'll learn how to create...
10

Tony Lea · 3 years ago

TailwindCSS, Give Me Some Space

Recently, I started using the space utility classes in Tailwind, which gives you the ability to create equal space between elements. When I first started using Tailwind, I found myself reach...
5

Kim Hallberg · 3 years ago

Laravel Quickie: How to install and build TailwindCSS v2 with Laravel Mix 😎

Introduction Welcome to another Laravel Quickie! In this quickie, we will go over how to install and build TailwindCSS v2 with the help of Laravel Mix. If you've already tried and have run i...
5

Tony Lea · 3 years ago

Tailwind V2 Released 🎉

Tailwind version 2.0 has been officially released along with a fancy new website. You gotta check it out, this thing is impressive. There are some pretty cool things available in v2, which...
5

Kim Hallberg · 3 years ago

How to create a Contact Us form with Livewire. 👋

Introduction. The contact form, an essential piece of functionality on every website. From a single input field asking for an email address. To full-page forms with address fields. Used to a...
6

Tony Lea · 3 years ago

TailwindCSS Gradients

As of Tailwind 1.7, you can create gradients without a single line of CSS 🎨. In this tutorial, I'll show you how easy it is to add gradients to your designs using Tailwind. Each gradient wi...
9

Tony Lea · 3 years ago

Creating a Slider with Tailwind CSS

Creating a slider with Tailwind and a little bit of javascript is actually very simple and that's what we'll be cover in this tutorial. First, we'll create the HTML and CSS for our slider, a...
6

Tony Lea · 3 years ago

Animating Tailwind Transitions on Page Load

Tailwind transitions classes gives you the ability to animate elements with very little effort. The only problem is that you can't implement animations using the transition classes alone. In...
5

Tony Lea · 3 years ago

Tailwind 1.7 Release

Tailwind 1.7 has been released with some really cool new features. Here are some of the cool things you should probably know about the latest version. Gradients I love a good gradient, and n...
8

Tony Lea · 3 years ago

Creating a Progress Bar with Tailwind

TailwindCSS is the bees knees and creating simple elements with Tailwind is really easy. In this quick tutorial, I want to show you how to create a quick progress bar like the following: Ad...
12

Tony Lea · 3 years ago

TailwindCSS Animations

Tailwind CSS version 1.6 was released last week. This new version does not introduce any new breaking changes, and it gives us some awesome animation utility classes. Animation Classes There...
7

Loading More Content