A wrapper for the color_models plugin with added support for Flutter's [Color] class.
For use without Flutter, see: https://pub.dev/packages/color_models
Check out flutter_palette, a package for creating, generating, and modifying color palettes.
Color Spaces #
color_models exposes models for the CMYK, HSI, HSL, HSP, HSV, LAB, RGB, and XYZ color spaces; represented as [CmykColor], [HsiColor], [HslColor], [HspColor], [HsvColor], [LabColor], [RgbColor], and [XyzColor] respectively.
Each model is constant and extends [ColorModel].
Creating Colors #
Colors can be created by constructing a [ColorModel] directly, or with the
[fromList] or [extrapolate] constructors. [extrapolate] accepts each model's respective values on a
and extrapolates them to their normal scale.
Each model posesses values for each property of their respective acronyms, as well as an optional [alpha] value.
// Each of the below colors is red at 100% opacity. // RGB without alpha RgbColor(255, 0, 0); RgbColor.fromList(<num>[255, 0, 0]); RgbColor.extrapolate(<num>[1.0, 0.0, 0.0]); // RGB with alpha RgbColor(255, 0, 0, 1.0); RgbColor.fromList(<num>[255, 0, 0, 1.0]); RgbColor.extrapolate(<num>[1.0, 0.0, 0.0, 1.0]); // CMYK without alpha CmykColor(0.0, 100.0, 100.0, 0.0); CmykColor.fromList(<num>[0.0, 100.0, 100.0, 0.0]); CmykColor.extrapolate(<num>[0.0, 1.0, 1.0, 0.0]); // CMYK with alpha CmykColor(0.0, 100.0, 100.0, 0.0, 1.0); CmykColor.fromList(<num>[0.0, 100.0, 100.0, 0.0, 1.0]); CmykColor.extrapolate(<num>[0.0, 1.0, 1.0, 0.0, 1.0]); // HSL without alpha HslColor(0.0, 100.0, 50.0); HslColor.fromList(<num>[0.0, 100.0, 50.0]); HslColor.extrapolate(<num>[0.0, 1.0, 0.5]); // HSL with alpha HslColor(0.0, 100.0, 50.0, 1.0); HslColor.fromList(<num>[0.0, 100.0, 50.0, 1.0]); HslColor.extrapolate(<num>[0.0, 1.0, 0.5, 1.0]);
Casting Color to and from the ColorModels #
Each color model has method
toColor() a static method
that will recast a [Color] to a [ColorModel] and vice versa, converting
the color to desired color space if not called on [RgbColor].
Color color = Color(0xFFFFFF00); // yellow CmykColor cmykColor = CmykColor.fromColor(color); color = cmykColor.toColor(); HsiColor hsiColor = HsiColor.fromColor(color); color = hsiColor.toColor(); HslColor hslColor = HslColor.fromColor(color); color = hslColor.toColor(); HspColor hspColor = HspColor.fromColor(color); color = hspColor.toColor(); HsvColor hsvColor = HsvColor.fromColor(color); color = hsvColor.toColor(); LabColor labColor = LabColor.fromColor(color); color = labColor.toColor(); RgbColor rgbColor = RgbColor.fromColor(color); color = rgbColor.toColor(); XyzColor xyzColor = XyzColor.fromColor(color); color = xyzColor.toColor();
Due to the nature of this implementation, the base [ColorModel] lacks the [toColor] method. Instead, the global [toColor] method can be used.
// Cast a [ColorModel] to a [Color]. var color = toColor(color);
Converting Colors Between Spaces #
Each color model has methods to convert itself to each of the other color models.
CmykColor toCmykColor(); HsiColor toHsiColor(); HslColor toHslColor(); HspColor toHspColor(); HsvColor toHsvColor(); LabColor toLabColor(); RgbColor toRgbColor(); XyzColor toXyzColor();
Altenatively, each color model has a constructor [ColorModel.from] that can accept a color from any color space and returns its own type (T).
// Create a HSV color HsvColor originalColor = HsvColor(0.3, 0.8, 0.7); // Convert it to RGB => RgbColor(64, 179, 36) RgbColor rgbColor = RgbColor.from(originalColor); // Then to CMYK => CmykColor(64.25, 0, 79.89, 29.8) CmykColor cmykColor = CmykColor.from(rgbColor); // Back to HSV => HsvColor(0.3, 0.8, 0.7) HsvColor hsvColor = HsvColor.from(cmykColor);
Note: All color conversions use the RGB color space as an
intermediary. To minimize the loss of precision when converting
between other color spaces, [RgbColor] privately stores the RGB
values as [num]s rather than [int]s. The [num] values can be
returned as a list with [RgbColor]'s
Color Adjustments #
For convenience, each [ColorModel] has 2 getters, [inverted] and [opposite], and 3 methods, [cooler], [warmer] and [rotateHue], for generating new colors.
[inverted] inverts the colors properties within their respective ranges, excluding hue, which is instead rotated 180 degrees.
final orange = RgbColor(255, 144, 0); print(orange.inverted); // RgbColor(0, 111, 255);
[opposite] returns the color with the hue opposite this. [opposite] is
[rotateHue] rotates the hue of the color by the [amount] specified in degrees. Colors in the CMYK, LAB, RGB, and XYZ color spaces will be converted to and from the HSL color space where the hue will be rotated.
final orange = RgbColor(255, 144, 0); print(orange.opposite); // RgbColor(0, 111, 255); print(orange.rotateHue(30)); // RgbColor(239, 255, 0); print(orange.rotateHue(-30)); // RgbColor(255, 17, 0);
[warmer] and [cooler] will rotate the hue of the color by the [amount] specified
90 degrees and
270 degrees, respectively. The hue's value will be
final orange = RgbColor(255, 144, 0); print(orange.warmer(30)); // RgbColor(239, 255, 0); print(orange.cooler(30)); // RgbColor(255, 17, 0);
Interpolating Between Colors #
Each color model has a method, [interpolateTo], that calculates a specified number
of steps between
this color and a color provided to the method, returning all of
the colors inbetween the two colors in a list. Colors will be returned in the color
space of the color the method is called on.
final color1 = RgbColor(255, 0, 0); // red final color2 = RgbColor(0, 0, 255); // blue /// Calculate a [List<RgbColor>] of 5 colors: [color1], [color2] and the 3 steps inbetween. final colors = color1.interpolateTo(color2, 3); // [RgbColor(255, 0, 0, 1.0), RgbColor(191, 0, 64, 1.0), RgbColor(128, 0, 128, 1.0), RgbColor(64, 0, 191, 1.0), RgbColor(0, 0, 255, 1.0)] print(colors); /// To return only the steps in between [color1] and [color2], the [excludeOriginalColors] parameter can be set to `true`. final steps = color1.interpolateTo(color2, 3, excludeOriginalColors: true); // [RgbColor(191, 0, 64, 1.0), RgbColor(128, 0, 128, 1.0), RgbColor(64, 0, 191, 1.0)] print(steps);
[0.1.6] - March 29, 2020 #
Added the [interpolateTo] method to each color model.
Override the conversion methods on each color model that return their own respective color spaces. Colors were being unnecessarily converted back and forth from RGB.
[0.1.5+1] - March 27, 2020 #
- Added the global [toColor] method.
[0.1.5] - March 24, 2020 #
Added the random factory constructor to each [ColorModel].
The equality operator and some getters now rounds values to the millionth due to the slight loss of precision during conversions.
The [hue] getter now calculates hues directly from RGB, rather than doing a full conversion to HSL.
Added the [isMonochromatic] getter to each [ColorModel].
[0.1.4+1] - March 23, 2020 #
- Fixed a bug and corrected rounding errors in HSP to RGB conversion.
[0.1.4] - March 22, 2020 #
- Added the [relative] parameter to the [warmer] and [cooler] methods.
[0.1.3+2] - March 22, 2020 #
- Added the [saturation] getter to [ColorModel].
[0.1.3+1] - March 22, 2020 #
- Added the [hue] getter to [ColorModel].
[0.1.3] - March 21, 2020 #
- Added the [inverted] and [opposite] getters, as well as the [warmer], [cooler], [rotateHue], and [withHue] methods to each [ColorModel].
[0.1.2] - March 18, 2020 #
- Added support for [alpha] values and related methods to each of the [ColorModel]s.
[0.1.1+1] - March 17, 2020 #
- Updated the color_models package to version 0.2.2+3.
[0.1.1] - March 16, 2020 #
Updated the color_models package to version 0.2.2+2.
Added the [fromHex] static method to each of the [ColorModel]s.
[0.1.0+2] - January 15, 2019 #
Updated the color_models package to version 0.2.1+2.
Documentation and formatting changes.
[0.1.0] - July 23, 2019 #
- Initial release
Use this package as a library
1. Depend on it
Add this to your package's pubspec.yaml file:
dependencies: flutter_color_models: ^0.1.6
2. Install it
You can install packages from the command line:
$ flutter pub get
Alternatively, your editor might support
flutter pub get.
Check the docs for your editor to learn more.
3. Import it
Now in your Dart code, you can use:
Describes how popular the package is relative to other packages. [more]
Code health derived from static analysis. [more]
Reflects how tidy and up-to-date the package is. [more]
Weighted score of the above. [more]
We analyzed this package on Mar 31, 2020, and provided a score, details, and suggestions below. Analysis was completed with status completed using:
- Dart: 2.7.1
- pana: 0.13.6
- Flutter: 1.12.13+hotfix.8
Maintain an example. (-10 points)
Create a short demo in the
example/ directory to show how to use this package.
Common filename patterns include
flutter_color_models.dart. Packages with multiple examples should provide
For more information see the pub package layout conventions.