> npm i @darudlingilien/mercuryui
Component utilities
.button .button-default .bg-gray-800 .text-white .button-md
Utilities shortcuts
.middle-center > @apply mx-auto my-auto
Premade animations
.hover-rotate-left
What is MercuryUI?
This is not a predesigned component library, Is a library of utilities for your components, Dont write the .card class everytime!, use our .card-lg class!
.card-lg {
@apply p-8 rounded-lg elevation-md;
}
Focused on components

Neater color palette

primary
secondary
success
info
danger
warning

Clear code

<button class="button button-default theme-primary">
    This is a button
</button>

Try it right now!