customization

Customize components

Easily personalize FlyonUI components with Tailwind CSS. Customize styles and layouts to build components tailored to your project’s needs.

FlyonUI components come with many built-in variants, making it unlikely that you’ll need to customize anything. However, if needed, you can still modify components in various ways:

  • For example, to customize this button:
<button class="btn">Button</button>

<button class="btn btn-primary">One</button>
<button class="btn btn-accent btn-gradient">Two</button>
<button class="btn btn-accent btn-outline">Three</button>
<button class="btn rounded-full">One</button>
<button class="btn rounded-none px-16">Two</button>
.btn {
  @apply rounded-full;
}