Introduction

ProseKit provides a set of components that you can copy and paste into your project. These components are styled with Tailwind CSS, allowing you to create beautiful, responsive editors with minimal effort.

1. Install Tailwind CSS

   If you haven't already, set up Tailwind CSS in your project. See the Tailwind CSS documentation for instructions.

2. Install recommended plugins

   You’ll need a few extra Tailwind CSS plugins for these components to work properly. Install the following:

   • pnpm
   • npm
   • yarn
   • bun

   pnpm add tw-animate-css @egoist/tailwindcss-icons @iconify-json/lucide

3. Configure Tailwind CSS

   Register the Tailwind CSS plugins in your global CSS file (e.g., global.css or app.css):

   @import "tailwindcss";
   @import "tw-animate-css";
   @plugin "@egoist/tailwindcss-icons";

4. That's it

   You can now start adding components to your project.