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.

Deploy your own

Deploy the example using Vercel or preview live with StackBlitz

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

npx create-next-app --example with-tailwindcss with-tailwindcss-app

yarn create next-app --example with-tailwindcss with-tailwindcss-app

pnpm create next-app --example with-tailwindcss with-tailwindcss-app

Deploy it to the cloud with Vercel (Documentation).

Name	Name	Last commit message	Last commit date
Latest commit CleoPatra2772 final changes Oct 2, 2022 55edb27 · Oct 2, 2022 History 16 Commits
apple-redesign	apple-redesign	changeschema	Sep 25, 2022
components	components	final changes	Oct 2, 2022
pages	pages	final changes	Oct 2, 2022
public	public	finish landing page	Sep 19, 2022
redux	redux	finish checkout page	Sep 30, 2022
styles	styles	adding redux and basketSlice	Sep 28, 2022
utils	utils	finish styling checkout success page	Oct 2, 2022
.gitignore	.gitignore	Initial commit from Create Next App	Sep 17, 2022
README.md	README.md	Initial commit from Create Next App	Sep 17, 2022
next.config.js	next.config.js	final changes	Oct 2, 2022
package-lock.json	package-lock.json	final changes	Oct 2, 2022
package.json	package.json	final changes	Oct 2, 2022
postcss.config.js	postcss.config.js	Initial commit from Create Next App	Sep 17, 2022
sanity.js	sanity.js	fetch category and product	Sep 26, 2022
tailwind.config.js	tailwind.config.js	finish landing page	Sep 19, 2022
tsconfig.json	tsconfig.json	Initial commit from Create Next App	Sep 17, 2022
typing.d.ts	typing.d.ts	final changes	Oct 2, 2022