Nira UI – Usage Guide

How to use Nira UI classes to style your page?

Once you installed Nira UI , you can use component classes like button, card, etc.These classes are built on top of Tailwind CSS, giving you:

• Cleaner, more readable HTML
• Faster design with fewer decisions
• Full compatibility with Tailwind utilities for customization

Without Nira UI (Tailwind CSS only)

To create a simple button in plain Tailwind CSS, you’d typically write:

  Button

This works but requires many utility classes for every button.

With Nira UI (Simplified)

With Nira UI, you can achieve the same result with a single, semantic class:

Button

This keeps your code clean, consistent, and easier to maintain.

Using Variants

Nira UI comes with component variants that extend functionality. For example:

Button

This instantly applies the primary color style without extra setup.

Combining with Tailwind Utilities

Since Nira UI is fully compatible with Tailwind CSS, you can still apply utility classes for deeper customization:

Button

Here, the button uses Nira UI’s base styling (button) while also applying custom Tailwind utilities (w-64 and rounded-full ).