dynamic_color 1.7.0 copy "dynamic_color: ^1.7.0" to clipboard
dynamic_color: ^1.7.0 copied to clipboard

A Flutter package to create Material color schemes based on a platform's implementation of dynamic color.

dynamic_color #

pub package

A Flutter package to create Material color schemes based on a platform's implementation of dynamic color. Currently supported platforms are:

This package also supports color and color scheme harmonization.

Getting started #

flutter pub add dynamic_color
import 'package:dynamic_color/dynamic_color.dart';

Features #

Builder widget #

DynamicColorBuilder is a stateful widget that provides the device's dynamic colors in a light and dark ColorScheme.

DynamicColorBuilder(
  builder: (ColorScheme? lightDynamic, ColorScheme? darkDynamic) {
    return ...;
  }
),

Plugin #

Under the hood, DynamicColorBuilder uses a plugin to talk to the OS.

Color and color scheme harmonization #

Harmonization makes adding and introducing new colors to your app more seamless by automatically shifting hue and chroma slightly so that a product's colors feel more cohesive with user colors.

This package provides two extension methods to accomplish this:

Color color = Colors.red;
// Shift's [color]'s hue towards the (dynamic) color scheme's primary color. This leaves the color recognizable while harmonizing it with a user's dynamic color.
harmonizedColor = color.harmonizeWith(colorScheme.primary);

// Does the same thing, for ColorScheme built-in semantic colors
harmonizedColorScheme = colorScheme.harmonized();

See harmonization.dart for details. Learn more about custom colors and harmonization on the Material 3 site.

Examples #

See example/lib/complete_example.dart for obtaining dynamic colors, creating harmonized color schemes, and harmonizing custom colors.

See example/lib/accent_color.dart for obtaining the accent color on desktop.

All examples are part of this example app (source). To run the example app:

cd example
flutter run

Testing #

import 'package:dynamic_color/test_utils.dart';
import 'package:dynamic_color/samples.dart';

void main() {
  // Reset for every test
  setUp(() => DynamicColorTestingUtils.setMockDynamicColors());

  testWidgets('Verify dynamic core palette is used ',
      (WidgetTester tester) async {
    DynamicColorTestingUtils.setMockDynamicColors(
      corePalette: SampleCorePalettes.green,
    );

    // ...
});

See example/test/widget_test.dart for an example.

Development #

The example app is hosted via GitHub pages. To update it:

cd example
flutter build web
493
likes
130
pub points
98%
popularity
screenshot

Publisher

verified publishermaterial.io

A Flutter package to create Material color schemes based on a platform's implementation of dynamic color.

Repository (GitHub)
View/report issues
Contributing

Documentation

API reference

License

Apache-2.0 (LICENSE)

Dependencies

flutter, flutter_test, material_color_utilities

More

Packages that depend on dynamic_color