{"id":16072163,"url":"https://github.com/themeselection/flyonui","last_synced_at":"2025-04-11T01:39:05.966Z","repository":{"id":257815938,"uuid":"854999911","full_name":"themeselection/flyonui","owner":"themeselection","description":"🚀 The easiest, free and open-source Tailwind CSS component library with semantic classes.","archived":false,"fork":false,"pushed_at":"2024-10-25T12:56:27.000Z","size":563,"stargazers_count":868,"open_issues_count":5,"forks_count":30,"subscribers_count":13,"default_branch":"main","last_synced_at":"2024-10-30T09:57:16.254Z","etag":null,"topics":["component-library","components","css","design-system","html","hugo","javascript","postcss","semantic","tailwind","tailwind-css","tailwind-css-template","tailwind-plugin","tailwindcss","tailwindcss-components-library","typescript","ui-framework","ui-library","uikit","webpack"],"latest_commit_sha":null,"homepage":"https://flyonui.com/","language":"CSS","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"other","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/themeselection.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":".github/CONTRIBUTING.md","funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2024-09-10T06:07:12.000Z","updated_at":"2024-10-30T05:29:35.000Z","dependencies_parsed_at":null,"dependency_job_id":"733494a0-9f4b-44b2-bcca-3adbcc99c1dc","html_url":"https://github.com/themeselection/flyonui","commit_stats":{"total_commits":27,"total_committers":6,"mean_commits":4.5,"dds":0.5925925925925926,"last_synced_commit":"d6fdd34403f6a194d42692bc1c28fe0bcec9acdc"},"previous_names":["themeselection/flyonui"],"tags_count":3,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/themeselection%2Fflyonui","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/themeselection%2Fflyonui/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/themeselection%2Fflyonui/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/themeselection%2Fflyonui/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/themeselection","download_url":"https://codeload.github.com/themeselection/flyonui/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247617117,"owners_count":20967535,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["component-library","components","css","design-system","html","hugo","javascript","postcss","semantic","tailwind","tailwind-css","tailwind-css-template","tailwind-plugin","tailwindcss","tailwindcss-components-library","typescript","ui-framework","ui-library","uikit","webpack"],"created_at":"2024-10-09T08:00:54.195Z","updated_at":"2025-04-11T01:39:05.958Z","avatar_url":"https://github.com/themeselection.png","language":"CSS","readme":"\u003ca href=\"https://flyonui.com\"\u003e\n  \u003cimg alt=\"flyonui logo\" width=\"800\" src=\"https://cdn.flyonui.com/fy-assets/smm/marketing/flyonui-smm-banner.png\"\u003e\n\u003c/a\u003e\u003cbr/\u003e\u003cbr/\u003e\n\n[FlyonUI](https://flyonui.com/) is the easiest, free and open-source Tailwind CSS component library with semantic classes. 🚀\n\n\u003cp\u003e\n    \u003ca href=\"https://www.npmjs.com/package/flyonui\"\u003e\u003cimg src=\"https://img.shields.io/npm/dt/flyonui.svg\" alt=\"Total Downloads on NPM\"\u003e\u003c/a\u003e\n    \u003ca href=\"https://github.com/themeselection/flyonui/releases\"\u003e\u003cimg src=\"https://img.shields.io/npm/v/flyonui.svg\" alt=\"Latest Version\"\u003e\u003c/a\u003e\n    \u003ca href=\"https://flyonui.com/docs/getting-started/license/\"\u003e\u003cimg src=\"https://img.shields.io/badge/license-MIT-blue\" alt=\"MIT License\"\u003e\u003c/a\u003e\n    \u003ca href=\"https://x.com/flyonui\" target=\"_blank\"\u003e\n      \u003cimg alt=\"Twitter Follow\" src=\"https://img.shields.io/twitter/follow/flyonui\"\u003e\n   \u003c/a\u003e\n\u003c/p\u003e\n\n\u003ca href=\"https://themeselection.com\" target=\"_blank\"\u003e\n  \u003cimg\n    src=\"https://cdn.themeselection.com/ts-assets/themeselection/logo/logo.png\"\n    alt=\"themeselection logo\"\n    height=\"30\"\n  /\u003e\n\u003c/a\u003e\n\nCreated by [ThemeSelection](https://themeselection.com), with a commitment to empowering the open-source community.\n\n---\n\n## Table of Contents 📋\n\n- [Table of Contents 📋](#table-of-contents-)\n- [Overview 🌏](#overview-)\n- [Why should I use FlyonUI? 💡](#why-should-i-use-flyonui-)\n- [Features ✨](#features-)\n- [Documentation 📚](#documentation-)\n- [Framework guides 🛠️](#framework-guides-️)\n- [Getting Started 🏁](#getting-started-)\n  - [Installation via NPM](#installation-via-npm)\n  - [RTL (Right-to-Left) Language Support](#rtl-right-to-left-language-support)\n- [Available Components 🧩](#available-components-)\n  - [Component Examples](#component-examples)\n- [Community 🤝](#community-)\n- [Contributing 📝](#contributing-)\n- [Credits 🤘](#credits-)\n- [License ©](#license-)\n- [Useful Links 🎁](#useful-links-)\n\n---\n\n## Overview 🌏\n\nFlyonUI is designed to combine the best of both worlds: the aesthetic appeal of semantic classes and the powerful functionality of JS plugins.\n\nUnder the hood, it uses the strengths of:\n\n- [Tailwind CSS](https://tailwindcss.com/) A utility-first CSS framework that helps you build beautiful websites with ease.\n- [daisyUI](https://daisyui.com/) adds component semantic class names to Tailwind CSS so you can make beautiful websites faster, easier and Maintainable.\n- [Preline](https://preline.co/plugins.html) JavaScript headless \u0026 fully unstyled Tailwind plugins for accessible, responsive UI. Enhance experiences with animations, transitions, and more.\n\n## Why should I use FlyonUI? 💡\n\nUsing Tailwind CSS alone may lead to cluttered HTML with numerous utility classes, which can be a nightmare to maintain.\n\nApart from that Tailwind CSS or daisyUI doesn’t provide any interactive headless JavaScript components like accordion, overlay, dropdowns, etc…\n\n**This is where FlyonUI shines.✨**\n\nFlyonUI [Tailwind CSS Components Library](https://flyonui.com/) brings together the beauty of semantic classes and the interactive headless JavaScript plugins, offering you a powerful toolkit to build stunning, interactive user interfaces with ease.\n\n- **Beautiful and Semantic Styling:** Utilize comprehensive CSS components with semantic class names for a clean and readable codebase.\n- **Interactive and Dynamic Features:** Incorporate Headless JavaScript plugins for ex: Accordion, Dropdown, Overlay etc… to add interactivity and dynamic behavior to your UI components.\n- **Efficiency and Productivity:** Enjoy a faster and more efficient development process by combining the strengths of semantic classes and JS plugins.\n- **Maintainable and Scalable:** Keep your projects maintainable and scalable with a consistent coding approach and powerful JS plugins.\n\n## Features ✨\n\n1. **800+ Free Components Examples**: Hundreds of component examples for all your WebApp needs that meet accessibility criteria.\n2. **Universal Framework Compatibility**: Fully compatible wherever Tailwind CSS is in action, from React to Vue and beyond.\n3. **Unlimited Themes**: Customize your app’s look and feel with FlyonUI’s theming capabilities. Refer to the theme section for more details.\n4. **Unstyled \u0026 Accessible Plugins**: Seamlessly add unstyled, accessible plugins for functionality without sacrificing design.\n5. **Responsive \u0026 RTL support** : Built with responsiveness in mind, ensuring your app looks great on all devices with RTL language support.\n6. **Free Forever:** Completely free forever, open-source, and built for the community.\n\n## Documentation 📚\n\nFor comprehensive documentation, please visit [flyonui.com](https://flyonui.com/).\n\n## Framework guides 🛠️\n\n\u003ctable\u003e\n  \u003ctr\u003e\n    \u003ctd width=\"20%\" align=\"center\"\u003eHTML\u003c/td\u003e\n    \u003ctd width=\"20%\" align=\"center\"\u003eReact\u003c/td\u003e\n    \u003ctd width=\"20%\" align=\"center\"\u003eNextjs\u003c/td\u003e\n    \u003ctd width=\"20%\" align=\"center\"\u003eVue\u003c/td\u003e\n    \u003ctd width=\"20%\" align=\"center\"\u003eNuxtjs\u003c/td\u003e\n  \u003c/tr\u003e\n  \u003ctr\u003e\n    \u003ctd width=\"20%\" align=\"center\"\u003e\n        \u003ca href=\"https://flyonui.com/docs/getting-started/quick-start/\"\u003e\n        \u003cimg src=\"https://cdn.flyonui.com/fy-assets/icons/html-icon.png\" alt=\"Html logo\" width=\"70\" /\u003e\n        \u003c/a\u003e\n    \u003c/td\u003e\n    \u003ctd width=\"20%\" align=\"center\"\u003e\n        \u003ca href=\"https://flyonui.com/framework-integrations/react/\"\u003e\n        \u003cimg src=\"https://cdn.flyonui.com/fy-assets/icons/react-icon.png\" alt=\"React logo\" width=\"70\" /\u003e\n        \u003c/a\u003e\n    \u003c/td\u003e\n    \u003ctd width=\"20%\" align=\"center\"\u003e\n        \u003ca href=\"https://flyonui.com/framework-integrations/nextjs/\"\u003e\n        \u003cimg src=\"https://cdn.flyonui.com/fy-assets/icons/nextjs-icon.png\" alt=\"Nextjs logo\" width=\"70\" /\u003e\n        \u003c/a\u003e\n    \u003c/td\u003e\n    \u003ctd width=\"20%\" align=\"center\"\u003e\n        \u003ca href=\"https://flyonui.com/framework-integrations/vuejs/\"\u003e\n        \u003cimg src=\"https://cdn.flyonui.com/fy-assets/icons/vue-vite-icon.png\" alt=\"Vue logo\" width=\"70\" /\u003e\n        \u003c/a\u003e\n    \u003c/td\u003e\n    \u003ctd width=\"20%\" align=\"center\"\u003e\n        \u003ca href=\"https://flyonui.com/framework-integrations/nuxtjs/\"\u003e\n        \u003cimg src=\"https://cdn.flyonui.com/fy-assets/icons/nuxt-icon.png\" alt=\"Nuxtjs logo\" width=\"70\" /\u003e\n        \u003c/a\u003e\n    \u003c/td\u003e\n  \u003c/tr\u003e\n  \u003ctr\u003e\n    \u003ctd width=\"20%\" align=\"center\"\u003eAngular\u003c/td\u003e\n    \u003ctd width=\"20%\" align=\"center\"\u003eSvelte\u003c/td\u003e\n    \u003ctd width=\"20%\" align=\"center\"\u003eRemix\u003c/td\u003e\n    \u003ctd width=\"20%\" align=\"center\"\u003eAstro\u003c/td\u003e\n    \u003ctd width=\"20%\" align=\"center\"\u003eQwik\u003c/td\u003e\n  \u003c/tr\u003e\n  \u003ctr\u003e\n    \u003ctd width=\"20%\" align=\"center\"\u003e\n        \u003ca href=\"https://flyonui.com/framework-integrations/angular/\"\u003e\n        \u003cimg src=\"https://cdn.flyonui.com/fy-assets/icons/angular-icon.png\" alt=\"Angular logo\" width=\"70\" /\u003e\n        \u003c/a\u003e\n    \u003c/td\u003e\n    \u003ctd width=\"20%\" align=\"center\"\u003e\n        \u003ca href=\"https://flyonui.com/framework-integrations/svelte/\"\u003e\n        \u003cimg src=\"https://cdn.flyonui.com/fy-assets/icons/svelte-icon.png\" alt=\"Svelte logo\" width=\"70\" /\u003e\n        \u003c/a\u003e\n    \u003c/td\u003e\n    \u003ctd width=\"20%\" align=\"center\"\u003e\n        \u003ca href=\"https://flyonui.com/framework-integrations/remix/\"\u003e\n        \u003cimg src=\"https://cdn.flyonui.com/fy-assets/icons/remix-icon.png\" alt=\"Remix logo\" width=\"70\" /\u003e\n        \u003c/a\u003e\n    \u003c/td\u003e\n    \u003ctd width=\"20%\" align=\"center\"\u003e\n        \u003ca href=\"https://flyonui.com/framework-integrations/astro/\"\u003e\n        \u003cimg src=\"https://cdn.flyonui.com/fy-assets/icons/astro-icon.png\" alt=\"Astro logo\" width=\"70\" /\u003e\n        \u003c/a\u003e\n    \u003c/td\u003e\n    \u003ctd width=\"20%\" align=\"center\"\u003e\n        \u003ca href=\"https://flyonui.com/framework-integrations/qwik/\"\u003e\n        \u003cimg src=\"https://cdn.flyonui.com/fy-assets/icons/qwik-icon.png\" alt=\"Qwik logo\" width=\"70\" /\u003e\n        \u003c/a\u003e\n    \u003c/td\u003e\n  \u003c/tr\u003e\n  \u003ctr\u003e\n    \u003ctd width=\"20%\" align=\"center\"\u003eSolidJS\u003c/td\u003e\n    \u003ctd width=\"20%\" align=\"center\"\u003eDjango\u003c/td\u003e\n    \u003ctd width=\"20%\" align=\"center\"\u003eFlask\u003c/td\u003e\n    \u003ctd width=\"20%\" align=\"center\"\u003eLaravel\u003c/td\u003e\n    \u003ctd width=\"20%\" align=\"center\"\u003e11ty\u003c/td\u003e\n  \u003c/tr\u003e\n  \u003ctr\u003e\n    \u003ctd width=\"20%\" align=\"center\"\u003e\n        \u003ca href=\"https://flyonui.com/framework-integrations/solidjs/\"\u003e\n        \u003cimg src=\"https://cdn.flyonui.com/fy-assets/icons/solidjs-icon.png\" alt=\"Django logo\" width=\"70\" /\u003e\n        \u003c/a\u003e\n    \u003c/td\u003e\n    \u003ctd width=\"20%\" align=\"center\"\u003e\n        \u003ca href=\"https://flyonui.com/framework-integrations/django/\"\u003e\n        \u003cimg src=\"https://cdn.flyonui.com/fy-assets/icons/django-icon.png\" alt=\"Django logo\" width=\"70\" /\u003e\n        \u003c/a\u003e\n    \u003c/td\u003e\n    \u003ctd width=\"20%\" align=\"center\"\u003e\n        \u003ca href=\"https://flyonui.com/framework-integrations/flask/\"\u003e\n        \u003cimg src=\"https://cdn.flyonui.com/fy-assets/icons/flask-icon.png\" alt=\"Flask logo\" width=\"70\" /\u003e\n        \u003c/a\u003e\n    \u003c/td\u003e\n    \u003ctd width=\"20%\" align=\"center\"\u003e\n        \u003ca href=\"https://flyonui.com/framework-integrations/laravel/\"\u003e\n        \u003cimg src=\"https://cdn.flyonui.com/fy-assets/icons/laravel-icon.png\" alt=\"Laravel logo\" width=\"70\" /\u003e\n        \u003c/a\u003e\n    \u003c/td\u003e\n    \u003ctd width=\"20%\" align=\"center\"\u003e\n        \u003ca href=\"https://flyonui.com/framework-integrations/eleventy/\"\u003e\n        \u003cimg src=\"https://cdn.flyonui.com/fy-assets/icons/11ty-icon.png\" alt=\"11ty logo\" width=\"70\" /\u003e\n        \u003c/a\u003e\n    \u003c/td\u003e\n  \u003c/tr\u003e\n\u003c/table\u003e\n\n## Getting Started 🏁\n\nFlyonUI can be easily integrated into any existing Tailwind CSS project.\n\n### Installation via NPM\n\nTo use FlyonUI, ensure that you have [Node.js](https://nodejs.org/en/) and [Tailwind CSS](https://tailwindcss.com/) installed.\n\n1. Install FlyonUI as a dependency:\n\n   ```bash\n   npm install flyonui\n   ```\n\n2. Include FlyonUI as a plugin in your `app.css` file:\n\n   ```css\n   @import \"tailwindcss\";\n   @plugin \"flyonui\";\n   @import \"./node_modules/flyonui/variants.css\"; // Require only if you want to use FlyonUI JS component\n\n   // If you gitignored node_modules use below method\n   @source \"./node_modules/flyonui/dist/index.js\"; // Require only if you want to use FlyonUI JS component\n   ```\n\n   This ensures that FlyonUI's styling is applied correctly throughout your project.\n\n   If you want to include specific js component:\n\n   ```css\n   @source \"./node_modules/flyonui/dist/accordion.js\";\n   ```\n\n3. For enabling interactive components such as accordion, dropdown,    modal etc... , include FlyonUI's JavaScript in your HTML file, just before the closing `\u003c/body\u003e` tag:\n\n   ```html\n   \u003cscript src=\"../node_modules/flyonui/flyonui.js\"\u003e\u003c/script\u003e\n   ```\n\n   For a single component, use the specific path:\n\n   ```html\n   \u003cscript src=\"../node_modules/flyonui/dist/accordion.js\"\u003e\u003c/script\u003e\n   ```\n\n### RTL (Right-to-Left) Language Support\n\nFlyonUI components offer native RTL support. Simply add the `dir=\"rtl\"` attribute to your HTML element to enable this feature.\n\n## Available Components 🧩\n\nFlyonUI provides a robust library of UI components built with Tailwind CSS utility classes, enabling fast and efficient web development. Our library includes 78+ components, from basic elements like buttons and cards to more complex third-party integrations.\n\n[Explore all components](https://flyonui.com/docs/components/accordion/)\n\n### Component Examples\n\n\u003ctable\u003e\n  \u003ctr\u003e\n    \u003ctd width=\"33.3333%\"\u003eAccordion\u003c/td\u003e\n    \u003ctd width=\"33.3333%\"\u003eAlert\u003c/td\u003e\n    \u003ctd width=\"33.3333%\"\u003eApex Charts\u003c/td\u003e\n  \u003c/tr\u003e\n  \u003ctr\u003e\n    \u003ctd width=\"33.3333%\" align=\"center\"\u003e\n        \u003ca href=\"https://flyonui.com/docs/components/accordion/\"\u003e\n            \u003cimg alt=\"Tailwind CSS Accordion\" src=\"https://cdn.flyonui.com/fy-assets/components-svg/components/accordion.svg\"\u003e\n        \u003c/a\u003e\n    \u003c/td\u003e\n    \u003ctd width=\"33.3333%\" align=\"center\"\u003e\n        \u003ca href=\"https://flyonui.com/docs/components/alert/\"\u003e\n            \u003cimg alt=\"Tailwind CSS Alert\" src=\"https://cdn.flyonui.com/fy-assets/components-svg/components/alert.svg\"\u003e\n        \u003c/a\u003e\n    \u003c/td\u003e\n    \u003ctd width=\"33.3333%\" align=\"center\"\u003e\n        \u003ca href=\"https://flyonui.com/docs/third-party-plugins/apex-charts/\"\u003e\n            \u003cimg alt=\"Tailwind CSS Apex Charts\" src=\"https://cdn.flyonui.com/fy-assets/components-svg/third-party-plugins/apex-charts.svg\"\u003e\n        \u003c/a\u003e\n    \u003c/td\u003e\n  \u003c/tr\u003e\n  \u003ctr\u003e\n    \u003ctd width=\"33.3333%\"\u003eButton\u003c/td\u003e\n    \u003ctd width=\"33.3333%\"\u003eCard\u003c/td\u003e\n    \u003ctd width=\"33.3333%\"\u003eCheckbox\u003c/td\u003e\n  \u003c/tr\u003e\n  \u003ctr\u003e\n    \u003ctd width=\"33.3333%\" align=\"center\"\u003e\n        \u003ca href=\"https://flyonui.com/docs/components/button/\"\u003e\n            \u003cimg alt=\"Tailwind CSS Button\" src=\"https://cdn.flyonui.com/fy-assets/components-svg/components/button.svg\"\u003e\n        \u003c/a\u003e\n    \u003c/td\u003e\n    \u003ctd width=\"33.3333%\" align=\"center\"\u003e\n        \u003ca href=\"https://flyonui.com/docs/components/card/\"\u003e\n            \u003cimg alt=\"Tailwind CSS Card\" src=\"https://cdn.flyonui.com/fy-assets/components-svg/components/card.svg\"\u003e\n        \u003c/a\u003e\n    \u003c/td\u003e\n    \u003ctd width=\"33.3333%\" align=\"center\"\u003e\n        \u003ca href=\"https://flyonui.com/docs/components/checkbox/\"\u003e\n            \u003cimg alt=\"Tailwind CSS Checkbox\" src=\"https://cdn.flyonui.com/fy-assets/components-svg/form-elements/checkbox.svg\"\u003e\n        \u003c/a\u003e\n    \u003c/td\u003e\n  \u003c/tr\u003e\n  \u003ctr\u003e\n     \u003ctd width=\"33.3333%\"\u003eDropdown\u003c/td\u003e\n    \u003ctd width=\"33.3333%\"\u003eInput\u003c/td\u003e\n    \u003ctd width=\"33.3333%\"\u003eModal\u003c/td\u003e\n  \u003c/tr\u003e\n  \u003ctr\u003e\n    \u003ctd width=\"33.3333%\" align=\"center\"\u003e\n        \u003ca href=\"https://flyonui.com/docs/overlays/dropdown/\"\u003e\n            \u003cimg alt=\"Tailwind CSS Dropdown\" src=\"https://cdn.flyonui.com/fy-assets/components-svg/overlays/dropdown.svg\"\u003e\n        \u003c/a\u003e\n    \u003c/td\u003e\n    \u003ctd width=\"33.3333%\" align=\"center\"\u003e\n        \u003ca href=\"https://flyonui.com/docs/forms/input/\"\u003e\n            \u003cimg alt=\"Tailwind CSS Input\" src=\"https://cdn.flyonui.com/fy-assets/components-svg/form-elements/input.svg\"\u003e\n        \u003c/a\u003e\n    \u003c/td\u003e\n    \u003ctd width=\"33.3333%\" align=\"center\"\u003e\n        \u003ca href=\"https://flyonui.com/docs/overlays/modal/\"\u003e\n            \u003cimg alt=\"Tailwind CSS Modal\" src=\"https://cdn.flyonui.com/fy-assets/components-svg/overlays/modal.svg\"\u003e\n        \u003c/a\u003e\n    \u003c/td\u003e\n  \u003c/tr\u003e\n  \u003ctr\u003e\n    \u003ctd width=\"33.3333%\"\u003eNavbar\u003c/td\u003e\n    \u003ctd width=\"33.3333%\"\u003eTabs \u0026 Pills\u003c/td\u003e\n    \u003ctd width=\"33.3333%\"\u003eTooltip\u003c/td\u003e\n  \u003c/tr\u003e\n  \u003ctr\u003e\n    \u003ctd width=\"33.3333%\" align=\"center\"\u003e\n        \u003ca href=\"https://flyonui.com/docs/navigations/navbar/\"\u003e\n            \u003cimg alt=\"Tailwind CSS Navbar\" src=\"https://cdn.flyonui.com/fy-assets/components-svg/navigations/navbar.svg\"\u003e\n        \u003c/a\u003e\n    \u003c/td\u003e\n    \u003ctd width=\"33.3333%\" align=\"center\"\u003e\n        \u003ca href=\"https://flyonui.com/docs/navigations/tabs-pills/\"\u003e\n            \u003cimg alt=\"Tailwind CSS Tabs \u0026 Pills\" src=\"https://cdn.flyonui.com/fy-assets/components-svg/navigations/tabs-pills.svg\"\u003e\n        \u003c/a\u003e\n    \u003c/td\u003e\n    \u003ctd width=\"33.3333%\" align=\"center\"\u003e\n        \u003ca href=\"https://flyonui.com/docs/overlays/tooltip/\"\u003e\n            \u003cimg alt=\"Tailwind CSS Tooltip\" src=\"https://cdn.flyonui.com/fy-assets/components-svg/overlays/tooltip.svg\"\u003e\n        \u003c/a\u003e\n    \u003c/td\u003e\n  \u003c/tr\u003e\n\u003c/table\u003e\n\n[Explore all components](https://flyonui.com/docs/components/accordion/)\n\n## Community 🤝\n\nJoin the FlyonUI community to discuss the library, ask questions, and share your experiences:\n\n- 🐦 [Follow us on Twitter](https://x.com/flyonui)\n- 💬 [Discuss on GitHub](https://github.com/themeselection/flyonui/discussions)\n- 🎮 [Join us on Discord](https://discord.com/invite/kBHkY7DekX)\n\n## Contributing 📝\n\nFix a bug, or add a new feature. You can make a pull request and see your code in the next version of FlyonUI.\n\nBefore adding a pull request, please see the **[contributing guidelines](https://github.com/themeselection/flyonui/blob/main/.github/CONTRIBUTING.md)**.\n\n## Credits 🤘\n\nWe are grateful for the contributions of the open-source community, particularly:\n\n- [TailwindCSS](https://tailwindcss.com/)\n- [daisyUI](https://daisyui.com/)\n- [Preline UI](https://preline.co/)\n\nThese projects form the backbone of FlyonUI, allowing us to build a powerful and user-friendly UI kit.\n\n## License ©\n\n- Copyright © [ThemeSelection](https://themeselection.com/)\n- Licensed under [MIT](https://github.com/themeselection/flyonui/blob/main/LICENSE)\n- FlyonUI is open-source software licensed under the MIT License.You can use our free items for personal as well as commercial purposes.\n\n## Useful Links 🎁\n\n- [Vue CheatSheet](https://vue-cheatsheet.themeselection.com/)\n- [Freebies](https://themeselection.com/item/category/freebies/)\n- [Download Free Admin Templates](https://themeselection.com/item/category/free-admin-templates/)\n- [Bootstrap 5 CheatSheet](https://bootstrap-cheatsheet.themeselection.com/)\n","funding_links":[],"categories":["Third Party Components","Recently Updated","TypeScript"],"sub_categories":["UI Libraries built on Tailwind CSS","[Oct 19, 2024](/content/2024/10/19/README.md)"],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fthemeselection%2Fflyonui","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fthemeselection%2Fflyonui","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fthemeselection%2Fflyonui/lists"}