#Tailwind
17 entries
Prompt to Add Dark Mode with Tailwind CSS v4
AI agent prompt to add system-aware dark mode to a Next.js app using Tailwind CSS v4 CSS variables and next-themes, with no flash on load.
Prompt to Build a Next.js AI Tool Directory
AI agent prompt to build a searchable Next.js AI tool directory with MDX data files, category filters, and static generation.
Prompt to Build a SaaS Pricing Page in Next.js
Copy-paste AI prompt to build a SaaS pricing page in Next.js with Tailwind, toggle billing, and Stripe-ready plan data.
Prompt to Build an Astro Static SEO Site
Copy-paste prompt for scaffolding a fully optimized Astro static site with content collections, sitemap, og-images, and TypeScript.
Prompt to Create an Admin Dashboard in Next.js
AI agent prompt to build a protected Next.js admin dashboard with data tables, server-side auth guards, and a sidebar layout using Tailwind.
AGENTS.md Rules for an Astro Static Site
A drop-in AGENTS.md for Astro static sites that keeps AI agents on-stack, prevents SSR drift, and enforces content collection conventions.
AGENTS.md Rules for a Next.js SaaS App
A drop-in AGENTS.md that keeps AI coding agents on-stack and on-convention in a Next.js SaaS codebase.
AI Coding Rules for Static Site Performance
AGENTS.md rules for static site performance that enforce Core Web Vitals, image optimization, font loading, and prevent agents from shipping render-blocking resources.
Cursor Rules for Tailwind CSS and shadcn/ui
Cursor rules that enforce Tailwind v4 conventions and shadcn/ui component patterns, preventing agents from reinventing primitives that already exist.
Prompt-to-PR: Add a Pricing Page
SOP for generating a production pricing page with monthly/annual toggle, feature matrix, and Stripe Checkout links in a Next.js Tailwind project.
Prompt-to-PR: Add an Admin Data Table
SOP for adding a server-side paginated, sortable, searchable admin data table in Next.js using TanStack Table and a PostgreSQL query — no ORM magic.
Prompt-to-PR: Add Dark Mode
End-to-end SOP for adding flicker-free dark mode to a Next.js Tailwind app using next-themes — class strategy, system preference, and persisted toggle.
Prompt-to-PR: Build a Static SEO Site with Astro
Complete SOP for scaffolding a content-driven static SEO site with Astro, Tailwind, MDX content collections, sitemap, and canonical tags from scratch.
Checklist for Reviewing AI-Generated Tailwind UI
A human review checklist for Tailwind CSS UI components written by AI coding agents — accessibility, responsiveness, dark mode, and purge safety.
AI Tool Directory — Context Pack
Copyable context pack for an AI tool directory site built with Astro and PostgreSQL, so agents understand the submission flow, tagging system, and content model from prompt one.
Astro Static SEO Site — Context Pack
A copyable context pack describing an Astro static SEO site so an AI agent can work in it correctly from the first prompt.
Next.js SaaS Starter — Context Pack
Copyable context pack for a Next.js SaaS app with App Router, Better Auth, Stripe billing, and Postgres so your AI agent works correctly from prompt one.