Flux 2.0 Livewire UI Kit

Last updated on by

Flux 2.0 Livewire UI Kit image

I might be late to the party, but I wanted to share all of the cool new components released in Flux 2.0, the official Livewire component library by Caleb Porzio. Flux 2.0 brings advanced components like date pickers, calendars, charts, and more. These components are built lean and dependency-free by the creator of Livewire:

Keeping Flux lightweight was a top priority. Instead of pulling in third-party date pickers and charts, we built our own from the ground up—resulting in only 13kb added to the bundle.

Why go through all that trouble for a few extra kilobytes?

While exploring third-party charting and date picker libraries, we kept running into the following:

  • Too much complex configuration
  • Difficulty styling to match our designs
  • Lack of accessibility & localization

With that, we decided to roll up our sleeves and build it all ourselves. And we're glad we did, because now we have the exact components we want for our use cases and nothing more. On top of that, when we encounter things we'd like added or modified in the future, we can just make it happen. No plugins, no pull requests, just changing our own code.

As part of the Flux 2.0 release, the Flux UI has a free tier of essential UI components that are used in the official Laravel Livewire starter kit. Using the Laravel starter kit will give you a taste of using Flux UI with Livewire and Laravel, and the premium version will give you advanced UI components to build UIs with Livewire. Flux 2.0 premium has per-project, unlimited, and business options for purchase.

Pick from one of Flux UIs themes or build your own
Pick from one of Flux UI's themes or build your own
Date range picker component
Date range picker component

Main Features

  • Lightweight Date Picker & Calendar: An accessible date picker and calendar component, built from scratch.
  • Line & Area Charts: Custom-built charting components that are lightweight and highly customizable.
  • Full Tailwind 4 Support: Tailwind 4, enabling developers to utilize the latest utility-first CSS framework features.
  • Free Tier with Essential UI Components: A free tier offering access to essential UI components. Flux is available in the Laravel Livewire starter kit.
  • And more..

Learn More

You can learn more about Flux 2.0 on the official site, which includes documentation, demos, and more. If you want to try Flux, you could start with the Laravel Livewire starter kit to quickly get a feel for using it. Flux 2.0 also has demos available for users who create an account. The Installation documentation will walk you through installing Flux in your Laravel project and contain all the setup and component usage documentation.

Paul Redmond photo

Staff writer at Laravel News. Full stack web developer and author.

Cube

Laravel Newsletter

Join 40k+ other developers and never miss out on new tips, tutorials, and more.

Curotec logo

Curotec

Hire the top Latin American Laravel talent. Flexible engagements, budget optimized, and quality engineering.

Curotec
Bacancy logo

Bacancy

Supercharge your project with a seasoned Laravel developer with 4-6 years of experience for just $2500/month. Get 160 hours of dedicated expertise & a risk-free 15-day trial. Schedule a call now!

Bacancy
Laravel Forge logo

Laravel Forge

Easily create and manage your servers and deploy your Laravel applications in seconds.

Laravel Forge
Tinkerwell logo

Tinkerwell

The must-have code runner for Laravel developers. Tinker with AI, autocompletion and instant feedback on local and production environments.

Tinkerwell
Cut PHP Code Review Time & Bugs into Half with CodeRabbit logo

Cut PHP Code Review Time & Bugs into Half with CodeRabbit

CodeRabbit is an AI-powered code review tool that specializes in PHP and Laravel, running PHPStan and offering automated PR analysis, security checks, and custom review features while remaining free for open-source projects.

Cut PHP Code Review Time & Bugs into Half with CodeRabbit
Join the Mastering Laravel community logo

Join the Mastering Laravel community

Connect with experienced developers in a friendly, noise-free environment. Get insights, share ideas, and find support for your coding challenges. Join us today and elevate your Laravel skills!

Join the Mastering Laravel community
Kirschbaum logo

Kirschbaum

Providing innovation and stability to ensure your web application succeeds.

Kirschbaum
Shift logo

Shift

Running an old Laravel version? Instant, automated Laravel upgrades and code modernization to keep your applications fresh.

Shift
Lucky Media logo

Lucky Media

Get Lucky Now - the ideal choice for Laravel Development, with over a decade of experience!

Lucky Media
Lunar: Laravel E-Commerce logo

Lunar: Laravel E-Commerce

E-Commerce for Laravel. An open-source package that brings the power of modern headless e-commerce functionality to Laravel.

Lunar: Laravel E-Commerce
LaraJobs logo

LaraJobs

The official Laravel job board

LaraJobs
SaaSykit: Laravel SaaS Starter Kit logo

SaaSykit: Laravel SaaS Starter Kit

SaaSykit is a Multi-tenant Laravel SaaS Starter Kit that comes with all features required to run a modern SaaS. Payments, Beautiful Checkout, Admin Panel, User dashboard, Auth, Ready Components, Stats, Blog, Docs and more.

SaaSykit: Laravel SaaS Starter Kit
MongoDB logo

MongoDB

Enhance your PHP applications with the powerful integration of MongoDB and Laravel, empowering developers to build applications with ease and efficiency. Support transactional, search, analytics and mobile use cases while using the familiar Eloquent APIs. Discover how MongoDB's flexible, modern database can transform your Laravel applications.

MongoDB

The latest

View all →
Connecting Laravel Socialite with Google Client PHP Library image

Connecting Laravel Socialite with Google Client PHP Library

Read article
Create Self-Contained PHP Executables with PHPacker image

Create Self-Contained PHP Executables with PHPacker

Read article
String Manipulation with Laravel's remove Method image

String Manipulation with Laravel's remove Method

Read article
Stargazing in Your Laravel App with Intervention Zodiac image

Stargazing in Your Laravel App with Intervention Zodiac

Read article
Simple Cookie Consent Packge for Laravel image

Simple Cookie Consent Packge for Laravel

Read article
Leveraging Laravel's Conditional Ping Methods for Task Monitoring image

Leveraging Laravel's Conditional Ping Methods for Task Monitoring

Read article