CINXE.COM

<!DOCTYPE html> <html lang="en"><head><script type="text/javascript" src="https://www.googletagmanager.com/gtm.js?id=GTM-MX6DBN9" async="async"></script><script type="text/javascript" src="/static/hash-o6oemknr/js/gtm.js"></script><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge"/><meta name="viewport" content="width=device-width, height=device-height, initial-scale=1, user-scalable=no"/><meta name="generator" content="made with love by dartdoc"/><meta name="description" content="material_color_utilities API docs, for the Dart programming language."/><title>material_color_utilities - Dart API docs</title><link rel="canonical" href="https://pub.dev/documentation/material_color_utilities/latest/"/><link rel="preconnect" href="https://fonts.gstatic.com"/><link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Roboto+Mono:ital,wght@0,300;0,400;0,500;0,700;1,400&display=swap"/><link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@24,400,0,0"/><link rel="stylesheet" href="/static/hash-o6oemknr/css/dartdoc.css"/><link rel="icon" href="/favicon.ico?hash=nk4nss8c7444fg0chird9erqef2vkhb8"/></head><body class="light-theme" data-base-href="" data-using-base-href="false"><noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-MX6DBN9" height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript><div id="overlay-under-drawer"></div><header id="title"><span id="sidenav-left-toggle" class="material-symbols-outlined" role="button" tabindex="0">menu</span><a class="hidden-xs" href="/"><img src="/static/hash-o6oemknr/img/dart-logo.svg" alt="" width="30" height="30" role="presentation" style="height: 30px; margin-right: 1em;"/></a><ol class="breadcrumbs gt-separated dark hidden-xs"><li><a href="/packages/material_color_utilities">material_color_utilities package</a></li><li class="self-crumb">documentation</li></ol><div class="self-name">material_color_utilities package</div><form class="search navbar-right" role="search"><input id="search-box" class="form-control typeahead" type="text" placeholder="Loading search..." autocomplete="off"/></form><div id="theme-button" class="toggle" title="Toggle brightness"><label for="theme"><input id="theme" type="checkbox" value="light-theme"/><span id="dark-theme-button" class="material-symbols-outlined">dark_mode</span><span id="light-theme-button" class="material-symbols-outlined">light_mode</span></label></div></header><main><div id="dartdoc-main-content" class="main-content"> <div class="desc markdown markdown-body"> <h1 id="material_color_utilities">material_color_utilities</h1> <p><a href="https://pub.dev/packages/material_color_utilities" rel="ugc"><img src="https://img.shields.io/pub/v/material_color_utilities.svg" alt="pub package"></a></p> <p>Algorithms and utilities that power the Material Design 3 color system, including choosing theme colors from images and creating tones of colors; all in a new color space.</p> <p>This is a low-level package. For developers looking to adopt Material 3 features such as dynamic color and color harmonization in their apps, please see the <a href="https://pub.dev/packages/dynamic_color" rel="ugc">dynamic_color</a> package.</p> <h2 id="getting-started">Getting started</h2>  <p>Add the following to your <code>deps</code>:</p> <pre class="language-skylark"><code class="language-skylark">"//third_party/dart/material_color_utilities", </code></pre>  <h2 id="usage">Usage</h2> <pre class="language-dart"><code class="language-dart">import 'package:material_color_utilities/material_color_utilities.dart'; </code></pre> <p>For more information, see the main  <a href="http://go/material-color-utilities" rel="ugc nofollow">README</a>.</p> <h2 id="contributing">Contributing</h2> <p>This repo is not accepting external contributions, but feature requests and bug reports are welcome on <a href="https://github.com/material-foundation/material-color-utilities/issues" rel="ugc nofollow">GitHub</a>.</p>  <h2 id="publishing">Publishing</h2> <ul> <li>Must be a member of <a href="https://pub.dev/publishers/material.io" rel="ugc">https://pub.dev/publishers/material.io</a></li> <li>Version numbering follows <a href="https://semver.org/" rel="ugc nofollow">Semantic Versioning</a></li> <li>Ensure <code>material_color_utilities.dart</code> exports all required libraries</li> </ul> <ol> <li>Update version and changes in <code>CHANGELOG.md</code>.</li> <li>Update version in <code>pubspec.yaml</code>.</li> <li>Publish with <code>dart pub publish</code> or <code>flutter pub publish</code>.</li> </ol>  </div> <div class="summary"> <h2>Libraries</h2> <dl> <dt id="blend"> <span class="name"><a href="blend_blend/blend_blend-library.html">blend/blend</a></span> </dt> <dd> </dd> <dt id="contrast"> <span class="name"><a href="contrast_contrast/contrast_contrast-library.html">contrast/contrast</a></span> </dt> <dd> </dd> <dt id="dislike_analyzer"> <span class="name"><a href="dislike_dislike_analyzer/dislike_dislike_analyzer-library.html">dislike/dislike_analyzer</a></span> </dt> <dd> </dd> <dt id="dynamic_color"> <span class="name"><a href="dynamiccolor_dynamic_color/dynamiccolor_dynamic_color-library.html">dynamiccolor/dynamic_color</a></span> </dt> <dd> </dd> <dt id="dynamic_scheme"> <span class="name"><a href="dynamiccolor_dynamic_scheme/dynamiccolor_dynamic_scheme-library.html">dynamiccolor/dynamic_scheme</a></span> </dt> <dd> </dd> <dt id="material_dynamic_colors"> <span class="name"><a href="dynamiccolor_material_dynamic_colors/dynamiccolor_material_dynamic_colors-library.html">dynamiccolor/material_dynamic_colors</a></span> </dt> <dd> </dd> <dt id="contrast_curve"> <span class="name"><a href="dynamiccolor_src_contrast_curve/dynamiccolor_src_contrast_curve-library.html">dynamiccolor/src/contrast_curve</a></span> </dt> <dd> </dd> <dt id="tone_delta_pair"> <span class="name"><a href="dynamiccolor_src_tone_delta_pair/dynamiccolor_src_tone_delta_pair-library.html">dynamiccolor/src/tone_delta_pair</a></span> </dt> <dd> </dd> <dt id="variant"> <span class="name"><a href="dynamiccolor_variant/dynamiccolor_variant-library.html">dynamiccolor/variant</a></span> </dt> <dd> </dd> <dt id="cam16"> <span class="name"><a href="hct_cam16/hct_cam16-library.html">hct/cam16</a></span> </dt> <dd> </dd> <dt id="hct"> <span class="name"><a href="hct_hct/hct_hct-library.html">hct/hct</a></span> </dt> <dd> </dd> <dt id="hct_solver"> <span class="name"><a href="hct_src_hct_solver/hct_src_hct_solver-library.html">hct/src/hct_solver</a></span> </dt> <dd> </dd> <dt id="viewing_conditions"> <span class="name"><a href="hct_viewing_conditions/hct_viewing_conditions-library.html">hct/viewing_conditions</a></span> </dt> <dd> </dd> <dt id="material_color_utilities"> <span class="name"><a href="material_color_utilities/material_color_utilities-library.html">material_color_utilities</a></span> </dt> <dd> </dd> <dt id="core_palette"> <span class="name"><a href="palettes_core_palette/palettes_core_palette-library.html">palettes/core_palette</a></span> </dt> <dd> </dd> <dt id="tonal_palette"> <span class="name"><a href="palettes_tonal_palette/palettes_tonal_palette-library.html">palettes/tonal_palette</a></span> </dt> <dd> </dd> <dt id="quantizer"> <span class="name"><a href="quantize_quantizer/quantize_quantizer-library.html">quantize/quantizer</a></span> </dt> <dd> </dd> <dt id="quantizer_celebi"> <span class="name"><a href="quantize_quantizer_celebi/quantize_quantizer_celebi-library.html">quantize/quantizer_celebi</a></span> </dt> <dd> </dd> <dt id="quantizer_map"> <span class="name"><a href="quantize_quantizer_map/quantize_quantizer_map-library.html">quantize/quantizer_map</a></span> </dt> <dd> </dd> <dt id="quantizer_wsmeans"> <span class="name"><a href="quantize_quantizer_wsmeans/quantize_quantizer_wsmeans-library.html">quantize/quantizer_wsmeans</a></span> </dt> <dd> </dd> <dt id="quantizer_wu"> <span class="name"><a href="quantize_quantizer_wu/quantize_quantizer_wu-library.html">quantize/quantizer_wu</a></span> </dt> <dd> </dd> <dt id="point_provider"> <span class="name"><a href="quantize_src_point_provider/quantize_src_point_provider-library.html">quantize/src/point_provider</a></span> </dt> <dd> </dd> <dt id="point_provider_lab"> <span class="name"><a href="quantize_src_point_provider_lab/quantize_src_point_provider_lab-library.html">quantize/src/point_provider_lab</a></span> </dt> <dd> </dd> <dt id="scheme"> <span class="name"><a href="scheme_scheme/scheme_scheme-library.html">scheme/scheme</a></span> </dt> <dd> </dd> <dt id="scheme_content"> <span class="name"><a href="scheme_scheme_content/scheme_scheme_content-library.html">scheme/scheme_content</a></span> </dt> <dd> </dd> <dt id="scheme_expressive"> <span class="name"><a href="scheme_scheme_expressive/scheme_scheme_expressive-library.html">scheme/scheme_expressive</a></span> </dt> <dd> </dd> <dt id="scheme_fidelity"> <span class="name"><a href="scheme_scheme_fidelity/scheme_scheme_fidelity-library.html">scheme/scheme_fidelity</a></span> </dt> <dd> </dd> <dt id="scheme_fruit_salad"> <span class="name"><a href="scheme_scheme_fruit_salad/scheme_scheme_fruit_salad-library.html">scheme/scheme_fruit_salad</a></span> </dt> <dd> </dd> <dt id="scheme_monochrome"> <span class="name"><a href="scheme_scheme_monochrome/scheme_scheme_monochrome-library.html">scheme/scheme_monochrome</a></span> </dt> <dd> </dd> <dt id="scheme_neutral"> <span class="name"><a href="scheme_scheme_neutral/scheme_scheme_neutral-library.html">scheme/scheme_neutral</a></span> </dt> <dd> </dd> <dt id="scheme_rainbow"> <span class="name"><a href="scheme_scheme_rainbow/scheme_scheme_rainbow-library.html">scheme/scheme_rainbow</a></span> </dt> <dd> </dd> <dt id="scheme_tonal_spot"> <span class="name"><a href="scheme_scheme_tonal_spot/scheme_scheme_tonal_spot-library.html">scheme/scheme_tonal_spot</a></span> </dt> <dd> </dd> <dt id="scheme_vibrant"> <span class="name"><a href="scheme_scheme_vibrant/scheme_scheme_vibrant-library.html">scheme/scheme_vibrant</a></span> </dt> <dd> </dd> <dt id="score"> <span class="name"><a href="score_score/score_score-library.html">score/score</a></span> </dt> <dd> </dd> <dt id="temperature_cache"> <span class="name"><a href="temperature_temperature_cache/temperature_temperature_cache-library.html">temperature/temperature_cache</a></span> </dt> <dd> </dd> <dt id="color_utils"> <span class="name"><a href="utils_color_utils/utils_color_utils-library.html">utils/color_utils</a></span> </dt> <dd> </dd> <dt id="math_utils"> <span class="name"><a href="utils_math_utils/utils_math_utils-library.html">utils/math_utils</a></span> </dt> <dd> </dd> <dt id="string_utils"> <span class="name"><a href="utils_string_utils/utils_string_utils-library.html">utils/string_utils</a></span> </dt> <dd> </dd> </dl> </div> </div><div id="dartdoc-sidebar-left" class="sidebar sidebar-offcanvas-left"><header id="header-search-sidebar" class="hidden-l"><form class="search-sidebar" role="search"><input id="search-sidebar" class="form-control typeahead" type="text" placeholder="Loading search..." autocomplete="off"/></form></header><ol id="sidebar-nav" class="breadcrumbs gt-separated dark hidden-l"><li><a href="/packages/material_color_utilities">material_color_utilities package</a></li><li class="self-crumb">documentation</li></ol>  <h5 class="hidden-xs"><span class="package-name">material_color_utilities</span> <span class="package-kind">package</span></h5> <ol> <li class="section-title">Libraries</li> <li><a href="blend_blend/blend_blend-library.html">blend/blend</a></li> <li><a href="contrast_contrast/contrast_contrast-library.html">contrast/contrast</a></li> <li><a href="dislike_dislike_analyzer/dislike_dislike_analyzer-library.html">dislike/dislike_analyzer</a></li> <li><a href="dynamiccolor_dynamic_color/dynamiccolor_dynamic_color-library.html">dynamiccolor/dynamic_color</a></li> <li><a href="dynamiccolor_dynamic_scheme/dynamiccolor_dynamic_scheme-library.html">dynamiccolor/dynamic_scheme</a></li> <li><a href="dynamiccolor_material_dynamic_colors/dynamiccolor_material_dynamic_colors-library.html">dynamiccolor/material_dynamic_colors</a></li> <li><a href="dynamiccolor_src_contrast_curve/dynamiccolor_src_contrast_curve-library.html">dynamiccolor/src/contrast_curve</a></li> <li><a href="dynamiccolor_src_tone_delta_pair/dynamiccolor_src_tone_delta_pair-library.html">dynamiccolor/src/tone_delta_pair</a></li> <li><a href="dynamiccolor_variant/dynamiccolor_variant-library.html">dynamiccolor/variant</a></li> <li><a href="hct_cam16/hct_cam16-library.html">hct/cam16</a></li> <li><a href="hct_hct/hct_hct-library.html">hct/hct</a></li> <li><a href="hct_src_hct_solver/hct_src_hct_solver-library.html">hct/src/hct_solver</a></li> <li><a href="hct_viewing_conditions/hct_viewing_conditions-library.html">hct/viewing_conditions</a></li> <li><a href="material_color_utilities/material_color_utilities-library.html">material_color_utilities</a></li> <li><a href="palettes_core_palette/palettes_core_palette-library.html">palettes/core_palette</a></li> <li><a href="palettes_tonal_palette/palettes_tonal_palette-library.html">palettes/tonal_palette</a></li> <li><a href="quantize_quantizer/quantize_quantizer-library.html">quantize/quantizer</a></li> <li><a href="quantize_quantizer_celebi/quantize_quantizer_celebi-library.html">quantize/quantizer_celebi</a></li> <li><a href="quantize_quantizer_map/quantize_quantizer_map-library.html">quantize/quantizer_map</a></li> <li><a href="quantize_quantizer_wsmeans/quantize_quantizer_wsmeans-library.html">quantize/quantizer_wsmeans</a></li> <li><a href="quantize_quantizer_wu/quantize_quantizer_wu-library.html">quantize/quantizer_wu</a></li> <li><a href="quantize_src_point_provider/quantize_src_point_provider-library.html">quantize/src/point_provider</a></li> <li><a href="quantize_src_point_provider_lab/quantize_src_point_provider_lab-library.html">quantize/src/point_provider_lab</a></li> <li><a href="scheme_scheme/scheme_scheme-library.html">scheme/scheme</a></li> <li><a href="scheme_scheme_content/scheme_scheme_content-library.html">scheme/scheme_content</a></li> <li><a href="scheme_scheme_expressive/scheme_scheme_expressive-library.html">scheme/scheme_expressive</a></li> <li><a href="scheme_scheme_fidelity/scheme_scheme_fidelity-library.html">scheme/scheme_fidelity</a></li> <li><a href="scheme_scheme_fruit_salad/scheme_scheme_fruit_salad-library.html">scheme/scheme_fruit_salad</a></li> <li><a href="scheme_scheme_monochrome/scheme_scheme_monochrome-library.html">scheme/scheme_monochrome</a></li> <li><a href="scheme_scheme_neutral/scheme_scheme_neutral-library.html">scheme/scheme_neutral</a></li> <li><a href="scheme_scheme_rainbow/scheme_scheme_rainbow-library.html">scheme/scheme_rainbow</a></li> <li><a href="scheme_scheme_tonal_spot/scheme_scheme_tonal_spot-library.html">scheme/scheme_tonal_spot</a></li> <li><a href="scheme_scheme_vibrant/scheme_scheme_vibrant-library.html">scheme/scheme_vibrant</a></li> <li><a href="score_score/score_score-library.html">score/score</a></li> <li><a href="temperature_temperature_cache/temperature_temperature_cache-library.html">temperature/temperature_cache</a></li> <li><a href="utils_color_utils/utils_color_utils-library.html">utils/color_utils</a></li> <li><a href="utils_math_utils/utils_math_utils-library.html">utils/math_utils</a></li> <li><a href="utils_string_utils/utils_string_utils-library.html">utils/string_utils</a></li> </ol> <div id="dartdoc-sidebar-left-content"></div></div><div id="dartdoc-sidebar-right" class="sidebar sidebar-offcanvas-right"> </div></main><footer><span class="no-break">material_color_utilities 0.12.0</span></footer><script src="/static/hash-o6oemknr/dartdoc/resources/highlight.pack.js"></script><script src="/static/hash-o6oemknr/dartdoc/resources/docs.dart.js"></script></body></html>