This example shows how to use Tailwind CSS (v3.0) with Next.js

Overview

Next.js + Tailwind CSS Example

This example shows how to use Tailwind CSS (v3.0) with Next.js. It follows the steps outlined in the official Tailwind docs.

Preview

Preview the example live on StackBlitz:

Open in StackBlitz

Deploy your own

Deploy the example using Vercel:

Deploy with Vercel

How to use

Execute create-next-app with npm or Yarn to bootstrap the example:

npx create-next-app --example with-tailwindcss with-tailwindcss-app
# or
yarn create next-app --example with-tailwindcss with-tailwindcss-app

Deploy it to the cloud with Vercel (Documentation).

You might also like...

Next.js and Tailwind.css with TypeScript Templete.

This is a Next.js project bootstrapped with create-next-app. Getting Started First, run the development server: npm run dev # or yarn dev Open http://

Jan 23, 2022

tooldb is a (soon) massive collection of frameworks and tools. It's build on Flowbite, Next.js, Tailwind CSS and uses Supabase.

tooldb is a (soon) massive collection of frameworks and tools. It's build on Flowbite, Next.js, Tailwind CSS and uses Supabase.

tooldb is a (soon) massive collection of frameworks and tools. It's build on Flowbite, Next.js, Tailwind CSS and uses Supabase.

Jul 14, 2022

Minimal Next.js + TypeScript + Tailwind CSS starter template.

Minimal Next.js + TypeScript + Tailwind CSS starter template.

⚡ next-ts-tailwind-starter ⚡ Minimal Next.js + TypeScript + Tailwind CSS starter template. Made by Piyush Pandey Give a ⭐ if you want to appreciate. 1

Jun 28, 2022

Careers page made with Next.js, Framer Motion & Tailwind CSS

Careers page made with Next.js, Framer Motion & Tailwind CSS

Careers Page Tech Stack: Next.js / Framer Motion / Tailwind CSS This is a Next.js project bootstrapped with create-next-app. Getting Started First, ru

Nov 16, 2022

A responsive and open source portfolio for software developers (Next.js & Tailwind CSS version).

A responsive and open source portfolio for software developers (Next.js & Tailwind CSS version).

Software Developer Portfolio 💯 A responsive and open source portfolio for software developers (Next.js & Tailwind CSS version). Website Screenshot In

Nov 28, 2022

Re-building @BizTech-Morocco website using Next.js and Tailwind CSS.

Re-building @BizTech-Morocco website using Next.js and Tailwind CSS.

BizTech UI Moroccan Community for Business And Technology. We believe in community; together we can learn more and build a tech product faster. Websit

Nov 8, 2022

Source code my personal website is written using Next.js, Tailwind CSS and Chakra UI

Source code my personal website is written using Next.js, Tailwind CSS and Chakra UI

Homepage Overview. / Home page. pages/blog/[slug] - Static pages/social - Social page. pages/photos - Photos page. pages/activites - Activites page Di

Dec 13, 2022

Next.js app using some dummy Tailwind CSS components

This is a Next.js project bootstrapped with create-next-app. Getting Started First, run the development server: npm run dev # or yarn dev Open http://

Oct 12, 2022

🌟 My Website/Blog using Next.js, Tailwind CSS and Vercel (v3)

🌟 My Website/Blog using Next.js, Tailwind CSS and Vercel (v3)

My Website made using Next.js, Tailwind CSS, and Vercel. Screenshots 📸 🚀 Live at - https://arunava.tech Features 🌟 Next.js Tailwind CSS Vercel Dark

Dec 22, 2022
Owner
Ananda Affan Fattahila
Hello I'm a Software Engineer and Agile Methodology Enthusiast.
Ananda Affan Fattahila
In this project we made a Tv shows webpage where you can like or comment the different shows.

JS Capstone Project In this project we made a Tv shows webpage where you can like or comment the differents shows. Built With HTML CSS JavaScript Lint

Lucas Bonnefon 4 Mar 16, 2022
TV Shows Web App - A web application based on an external API which contains information about TV shows

TV Shows Web App - A web application based on an external API which contains information about TV shows. th web app let you like the shows that you like the most and comment what you think about them making use of an involvement API to save this interaction information.

Williams Colmenares 14 Dec 17, 2022
TV Shows Web App - A web application based on an external API which contains information about TV shows

TV Shows Web App - A web application based on an external API which contains information about TV shows. th web app let you like the shows that you like the most and comment what you think about them making use of an involvement API to save this interaction information.

Williams Colmenares 14 Dec 17, 2022
⏪ Rewinds – Remix Tailwind Starter Kit with Tailwind CSS, Headless UI, Radix UI, and more

⏪ Rewinds – Remix Tailwind Starter Kit Rewinds is a Remix starter kit with Tailwind CSS v3 family of libraries. This is an example demo to combine the

M Haidar Hanif 81 Dec 24, 2022
This is a little script that shows how to ddos a website. This is for example purposes only. Don't ddos a website without the consent of his owner

Dddos-Script This is a little script to ddos a website. This is for example purposes only. I am not responsable of what you do with it If you like thi

null 13 Dec 17, 2022
A Tailwind plugin that allows to create multiple groups utilities such as group-card or group-1 and works with Tailwind 3 features and all variations.

Tailwind Labeled Groups A plugin that allows to create multiple groups utilities such as group-card or group-1 and works with Tailwind 3 features and

Max 18 Nov 21, 2022
♦ Crowd funding project using Smart Contracts on the Ethereum. Created with Next.js and Tailwind CSS.

Crowdcoin ♦ Crowd funding project using Smart Contracts on the Ethereum. Created with Next.js and Tailwind CSS. Project from "Ethereum and Solidity: T

Luiz Fernando Veríssimo 2 Dec 14, 2022
This is the repo for the Medium2 project with Next.js, Sanity CMS, React and Tailwind CSS

Next.js + Tailwind CSS Example This example shows how to use Tailwind CSS (v3.0) with Next.js. It follows the steps outlined in the official Tailwind

null 1 Jan 22, 2022
Starter template for a personal website blog, built with Next.js, MDX, and Tailwind CSS.

nextjs-mdx-blog-theme View: demo site Framework: Next.js Deployment: Vercel Content: MDX Styling: Tailwind CSS Running Locally $ git clone https://git

Alex Carpenter 18 Dec 26, 2022
⚡ Personal website and blog made using TypeScript, Next.js, Tailwind CSS.

小康 blog View Demo · Report Bug · Request Feature ?? honghong.me Framework: Next.js Database: Planetscale ORM: Prisma Authentication: NextAuth.js Deplo

小康 94 Dec 31, 2022