NotionX Tailwind Blocks

NotionX Tailwind Blocks

Production-ready Tailwind CSS components. No installation required.

Copy. Paste. Ship. Beautiful UI components in seconds.

⚡ The Fastest Way to Beautiful UIs

Skip the setup. Forget about installing packages. NotionX Tailwind Blocks gives you:

🚀 Just Copy & Paste - No npm install, no dependencies
💅 Production-Ready Design - Professionally crafted components
📱 Responsive by Default - Looks great on any device
🎯 Basic Accessibility - Includes fundamental ARIA attributes
🎯 Zero Config - Works with any Tailwind CSS project
⚡ Instant Usage - No build steps, no compilation needed

🚀 Getting Started

Make sure you have Tailwind CSS installed in your project
Browse our component library
Find a component you like
Copy the code
Paste into your project
That's it! No really, that's all you need to do 🎉

🎨 Component Categories

Avatars - User profiles and image displays
Badges - Status indicators and labels
Breadcrumbs - Navigation trails
Buttons - Actions and links
Cards - Content containers
Forms - User input collections
Inputs - Text fields and controls
Lists - Content organization
Modals - Overlay dialogs
Tables - Data presentation
Tabs - Content organization
Toggles - Interactive controls
And many more, with new components added regularly!

🧞 Commands

All commands are run from the root of the project, from a terminal:

Command	Action
`npm install`	Installs dependencies
`npm run dev`	Starts local dev server at `localhost:4321`

View it live at https://notionx.ufotab.com