Weave Code
Flux Laravel Package
livewire/flux
Flux is a hand-crafted UI component library for Livewire, built with Tailwind CSS and designed to be easy to use and customize. The free package includes Button, Dropdown, Icon, Separator, and Tooltip components; additional Pro components are available with a license.
The official UI component library for Livewire.
Frequently asked questions about Flux
- What is livewire/flux and what components does the free package include?
- Flux is the official UI component library for Livewire, built with Tailwind CSS and designed to be easy to use and customize. The free livewire/flux package ships only Button, Dropdown, Icon, Separator, and Tooltip. Form, table, modal, date-picker, chart, and layout components are part of the paid Flux Pro tier. Treat it as a commercial UI kit rather than a fully open-source utility library.
- How do I install livewire/flux in a Laravel application?
- Run composer require livewire/flux from your project root, then add the @fluxAppearance directive in your layout head and @fluxScripts before the closing body tag. In resources/css/app.css import tailwindcss and ../../vendor/livewire/flux/dist/flux.css, and add the dark custom variant. If you have a Pro license, run php artisan flux:activate and supply your email and license key. Confirm your app already meets the Laravel 10, Livewire 3.5.19, and Tailwind 4 prerequisites before installing.
- What Laravel, Livewire, and Tailwind versions does Flux require?
- Flux requires Laravel 10.0 or newer, Livewire 3.5.19 or newer, and Tailwind CSS 4.0 or newer. The Tailwind 4 requirement is usually the biggest gate for existing applications, not Composer resolution. A Blaze dependency has also appeared in release notes, so pin and verify the full support matrix in CI. If your app is still on Tailwind 3, plan the migration before adopting Flux.
- Do I need a Flux Pro license to use forms, modals, or tables?
- Yes. The free package includes only Button, Dropdown, Icon, Separator, and Tooltip, so forms, modals, tables, date pickers, charts, and layout components require Flux Pro. Inventory the screens you plan to build against the free versus Pro boundary before committing. Budget for the license and renewal, and confirm whether procurement and security need to review the vendor terms. The free and Pro boundary can move between releases, so recheck it on upgrade.
- How do I activate and manage a Flux Pro license across environments?
- Pro activation uses php artisan flux:activate, which prompts for your email and license key. Store the key as a secret in CI, staging, and production, and include activation as an explicit deploy step rather than assuming it carries over. Offline or restricted CI environments need a documented path, since activation is a network operation. Test activation in every environment before relying on Pro components in a release.
- Does Flux work with Tailwind CSS 3, or is Tailwind 4 required?
- Flux requires Tailwind CSS 4.0 or newer, so an existing Tailwind 3 application must migrate first. The CSS setup imports tailwindcss and the vendored flux.css, plus a dark custom variant. This migration is the primary feasibility gate, not the Composer install. Run a time-boxed spike that upgrades Tailwind and Flux together before migrating screens in slices.
- Can I use Flux with React, Vue, or Inertia?
- Flux is built for Livewire and Tailwind, so it is a poor fit for SPA-first stacks such as React, Vue, or Inertia. It is also a poor fit for API-only services or teams that require a fully open-source, vendor-neutral component library. Flux makes most sense in server-rendered Laravel apps already using Livewire 3 for admin consoles, SaaS CRUD screens, and internal tools. If your front end is Inertia-driven, look elsewhere.
- How do I customize Flux components safely and avoid upgrade drift?
- Prefer CSS variables, Tailwind tokens, and app-specific wrapper Blade components over publishing vendor Blade files. Wrapping Flux components reduces direct coupling to its API and insulates your brand and behavior changes from releases. Published Blade files drift from upstream and can break on 2.x upgrades that ship frequent fixes and occasional API churn. Document any overrides and review them each time you bump the package.
- Is livewire/flux production-ready and actively maintained?
- Flux is official Livewire tooling with an active 2.x release cadence, frequent fixes, and occasional API churn, so it is maintained but fast-moving. Public adoption signals are weak in open source terms, with roughly 979 stars and zero public dependents, likely because installs are private or commercial. Treat the overall technical risk as medium and validate with references and a pilot. Pin versions, read release notes, and keep a rollback path for Livewire, Tailwind, and Flux skew.
- How do I test Flux components and check CSP and accessibility?
- Cover Flux screens with Livewire component tests and browser tests, and verify Vite asset resolution, dark-mode variants, and Livewire navigate behavior in CI. Check Content Security Policy headers, since complex components may inject styles or scripts that need allowances. Run accessibility checks against your WCAG targets, because complex Pro components can introduce regressions. Pin livewire/flux, livewire/flux-pro, Livewire, Laravel, Tailwind, and Blaze so tests reflect a known combination.
Weaver
How can I help you explore Laravel packages today?