DEV Community

Cover image for πŸš€ Nurui A New UI Component Library for React Developers.
Md Afsar Mahmud
Md Afsar Mahmud

Posted on

πŸš€ Nurui A New UI Component Library for React Developers.

What is Nurui??

Nurui is a modern, open-source UI component library built with Next.js and Tailwind, designed to give developers speed, flexibility, and full control over their UI.

Unlike most libraries, Nurui focuses on:

  • Keeping your most-used components in one place
  • Full customization with clean, extendable structure
  • Developer-first experience with CLI & live preview support

Github
Live

Why Nurui?
You might be thinking β€” β€œWhy build another UI library?”

Good question.

After working with tools like shadcn/ui, Aceternity UI, and Magic UI, I realized:

I need a space where I can store my most-used components and animations, fully customize them, and reuse them across projects with ease.

That’s how Nurui was born a personal tool turned open-source project for the dev community.

Installation

1. To see the full list of available components you can install:

npx nurui list
Enter fullscreen mode Exit fullscreen mode

2. Add Components
You can now start adding components to your project.

npx nurui add gradient-button
Enter fullscreen mode Exit fullscreen mode

This will generate the component in: components/nurui/GradientButton.tsx

3. Import and use the component
The command above will add the GradientButton component to your project. You can then import it like this:

import { GradientButton } from "@/components/nurui/GradientButton";

export default function Home() {
return (
  <div>
    <GradientButton />
  </div>
);
}
Enter fullscreen mode Exit fullscreen mode

πŸ”­ Coming Soon

  • AI-Generated Documentation
  • Interactive Component Playground
  • Responsive Preview for different breakpoints

🀝 How to Contribute

  • ⭐ Giving a Star on GitHub
  • πŸ›  Submitting pull requests or improvements
  • πŸ’¬ Sharing feedback or suggestions

❀️ Final Thoughts

I built Nurui to simplify my workflow β€” and I’m thrilled to share it with you. If you're looking for a customizable, lightweight, and dev-focused UI library β€” give Nurui a try.Feel free to explore, use it in your own projects, and let me know how I can improve it!

Top comments (2)

Collapse
 
khaledsaeed18 profile image
Khaled Saeed

Looks clean and promising! Excited to see how Nurui evolves. great work! πŸ‘

Collapse
 
md-afsar-mahmud profile image
Md Afsar Mahmud

Thank you so much! πŸ™Œ
Really glad you liked the clean look that means a lot! πŸ’™
I’m super excited too to keep evolving Nurui with more powerful and flexible components. Stay tuned lots of cool updates are on the way! πŸš€