Loading...

🔘 Tailwind CSS Buttons with NiraUI

Buttons are one of the most important UI elements they help users take action, navigate, or confirm decisions.

With NiraUI, you can build beautiful, accessible buttons in seconds no custom CSS required.

🧱 Default Buttons

Use the base .button class to create a clean, ready-to-use button.

Link Button





Link Button

NiraUI buttons work with multiple HTML elements — button, a, and even input types:

Anchor

Anchor



🎨 Button Colors

NiraUI includes a full color system so your buttons can match any design theme.







Each variant has both solid and outline options for contrast and flexibility.

📏 Button Sizes

Easily adjust the size of your buttons using built-in size classes.






🖋️ Outline Buttons

Outline buttons use a border and transparent background for a lighter, modern look.







🌤️ Soft Buttons

Soft buttons feature light background tones for subtle UI sections like toolbars or cards.







👻 Ghost Buttons

Ghost buttons are transparent with colored text perfect for minimalist interfaces.







🌀 Rounded & Circular Buttons

NiraUI makes it easy to create fully rounded or circular buttons for icons and CTAs.




↔️ Full-Width Buttons

Make your buttons stretch the full width of their container using .button-full.



⏳ Loading States

Indicate progress interactions effortlessly



Disabled States

Easily create disabled buttons to prevent user interaction.



🚀 Build Buttons That Feel Great to Click

From CTAs to forms, NiraUI gives you the perfect button for every scenario — clean, accessible, and built entirely with Tailwind CSS.