- Install Tailwind CSS:
npm create astro@latest -- --template with-tailwindcss
- Install daisyUI:
npm i daisyui@latest
- Then add daisyUI to your
tailwind.config.js
files:
module.exports = {
//...
plugins: [require("daisyui")],
}
- The official Tailwind CSS Typography plugin(
@tailwindcss/typography
) provides a set of prose classes:
npm install @tailwindcss/typography
- Then add the plugin to your
tailwind.config.js
files:
/** @type {import('tailwindcss').Config} */
module.exports = {
theme: {
// ...
},
plugins: [
require('@tailwindcss/typography'),
// ...
],
}
Astro comes with Tailwind support out of the box. This example showcases how to style your Astro project with Tailwind and daisyUI.
For complete setup instructions, please see our Tailwind Integration Guide and daisyUI.