![ModularUI : Pre-built beautiful flutter widgets Inspired by material-tailwind and shadcn/ui](https://private-user-images.githubusercontent.com/67179751/300255525-c4f1045b-0d7a-4228-b663-3e1f8238d59c.jpg?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MzkzNzYxMjIsIm5iZiI6MTczOTM3NTgyMiwicGF0aCI6Ii82NzE3OTc1MS8zMDAyNTU1MjUtYzRmMTA0NWItMGQ3YS00MjI4LWI2NjMtM2UxZjgyMzhkNTljLmpwZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNTAyMTIlMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjUwMjEyVDE1NTcwMlomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPWExN2U4YThmYmVkODg0MTM5YWI0ZjIyODhhM2ZlMDkyOTI5ZDgwYWQyZDRkMGQwM2IxMDgyY2NmNmU0MjgzMWYmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0In0.53u3Pz-SDJrl8notaPGv_dImzVDGQ4CvMKWPpTSTPiw)
Craft beautiful, accessible, and responsive Flutter UIs with a Modular-UI Design-inspired component library
Run this command in your terminal
flutter pub add modular_ui
Add this line to import the package.
import 'package:modular_ui/modular_ui.dart';
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
- MUI Simple Card
- MUI Primary Card
- MUI SignIn Card
- MUI SignUp Card
- MUI Profile Card
- MUI Pricing Card
- MUI Blog Card
- MUI Primary Button
- MUI Secondary Button
- MUI Text Button
- MUI Outlined Button
- MUI Gradient Button
- MUI Loading Button
- MUI Secondary Outlined Button
- MUI Radio Button
- MUI Primary Block Level Button
- MUI Secondary Block Level Button
- MUI Secondary Outlined Block Level Button
- MUI Text Block Level Button
- MUI Outlined Block Level Button
- MUI Loading Block Level Button
- MUI Gradient Block Level Button
Primary Button
MUIPrimaryButton(
text: "Primary Button",
onPressed: () => onButtonPressed("Primary Button"),
),
Primary Card
MUIPrimaryCard(
title: 'UI/UX Review Check',
description:
'The place is close to Barceloneta Beach and bus stop just 2 min by walk and near to "Naviglio" where you can enjoy the main night life in Barcelona',
image: Image.network(
'https://images.unsplash.com/photo-1540553016722-983e48a2cd10?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=800&q=80',
fit: BoxFit.cover,
),
buttons: [
MUIPrimaryButton(
text: 'Read More',
onPressed: () {},
),
],
),
Primary Carousal
MUICarousel(
images: [
"https://github.com/shadcn.png",
"https://github.com/shadcn.png",
"https://github.com/shadcn.png",
"https://github.com/shadcn.png",
"https://github.com/shadcn.png"
],
indicatorType: CarouselIndicatorType.dot,
duration: Duration(seconds: 2),
),
For more code samples, you can head on to our documentaion at . https://modularui.site
- Comprehensive Modular-UI Design components: Build modern and feature-rich interfaces with a wide range of buttons, cards, forms, navigation elements, and more.
- Highly customizable: Tailor components to your exact needs with extensive styling options.
- Responsive design: Ensure optimal UI experiences across different screen sizes.
- Accessibility focus: Built with accessibility in mind, adhering to best practices.
- Lightweight and performant: Efficiently crafted for smooth user interactions.
- Custom themes and color palettes: Define your own visual style for a cohesive look.
- Dark mode support: Seamlessly adapt your UI to user preferences.
Calling on all the trendsetting Flutter enthusiasts! ❤️🔥 Join forces as we pioneer the creation of the ultimate, expansive, and seamless UI Library for Flutter. Let's make waves together! 🚀 Please refer to our contribution guidelines for details and don't forget to drop a Hi at discord