Installation
A simple guide to set up ui/topia with the required dependencies and structure.
This project is built with Next.js, using TypeScript and Tailwind CSS for all components. Some components also rely on shadcn/ui and Motion.
For the best development experience, I recommend using TypeScript, but it’s not mandatory.
Install Tailwind CSS
The components are styled using Tailwind CSS.
Follow the official installation guide to set it up in your project.
Add a Utility Helper
To make it easier to conditionally apply Tailwind CSS classes, add this cn
helper function to your project.
Folder Structure
Here’s a recommended folder structure to organize your components and utilities:
your-desired-components.tsx
utils.ts
Feel free to adapt it based on your project’s needs.
You're all set! You can now start enjoying the components.
Edit on GitHub
Last updated on