smart_color_palette
A flexible and dynamic color palette utility for Flutter applications.
smart_color_palette helps developers generate consistent, accessible color themes across UI components such as text, icons, buttons, and borders. It automatically creates smooth transitions between base and target colors by generating 10 interpolated shades, ensuring clean design and excellent contrast for both light and dark themes.
โจ Features
- ๐จ Auto-generated 10-step color gradients between any two colors
- ๐งฉ Define custom
ColorPairs for:primary,base,text,icon,border, andbutton
- ๐ Works well with light and dark mode theming
- ๐ง Easy integration into Flutter design systems
๐ฆ Installation
Add this to your pubspec.yaml:
dependencies:
smart_color_palette: ^1.0.0
Then run:
flutter pub get
๐ Usage
1. Import the package
import 'package:smart_color_palette/smart_color_palette.dart';
2. Create a color palette (e.g. in colors.dart)
final palette = ColorPalette(
primary: ColorPair(base: Colors.blue, target: Colors.deepPurple),
base: ColorPair(base: Colors.white, target: Colors.grey[200]!),
text: ColorPair(base: Colors.black, target: Colors.white),
icon: ColorPair(base: Colors.grey[800]!, target: Colors.white),
border: ColorPair(base: Colors.grey, target: Colors.black),
);
3. Use color shades in your UI
Container(
padding: EdgeInsets.all(16),
color: palette.baseColorShade2,
child: Text(
'Hello Palette!',
style: TextStyle(color: palette.textColorShade9),
),
);
๐งช Available Shades
Each ColorPair produces 10 interpolated shades. You can access them like:
palette.primaryColorShade1; // Lightest shade
palette.primaryColorShade10; // Darkest shade
Shade Accessors
primaryColorShade1โprimaryColorShade10baseColorShade1โbaseColorShade10textColorShade1โtextColorShade10iconColorShade1โiconColorShade10borderColorShade1โborderColorShade10buttonColorShades1โbuttonColorShades10
๐ก Contributions
Contributions, issues, and feature requests are welcome!
Feel free to open an issue or submit a pull request.