MCPcopy Index your code
hub / github.com/material-foundation/material-color-utilities

github.com/material-foundation/material-color-utilities @main

Chat with this repo
repository ↗ · DeepWiki ↗ · + Follow
2,088 symbols 7,092 edges 222 files 473 documented · 23% 13 cross-repo links updated 2mo ago★ 2,20489 open issues
What it actually does AI analysis from the code graph — generated when you open this
loading…
README

Material Color Utilities

Color is a powerful design tool and part of the Material system along with styles like typography and shape. In products, colors and the way they are used can be vast and varied. An app’s color scheme can express brand and style. Semantic colors can communicate meaning. And color contrast control supports visual accessibility.

In many design systems of the past, designers manually picked app colors to support the necessary range of color applications and use cases. Material 3 introduces a dynamic color system, which does not rely on hand-picked colors. Instead, it uses color algorithms to generate beautiful, accessible color schemes based on dynamic inputs like a user’s wallpaper. This enables greater flexibility, personalization, and expression, all while streamlining work for designers and teams.

Material Color Ultilities (MCU) powers dynamic color with a set of color libraries containing algorithms and utilities that make it easier for you to develop color themes and schemes in your app.

Library availability

Language Availability Location
C++
Dart pub package
Java MDC-Android
Swift
TypeScript npm package
Kotlin

Need another platform/language? Check the existing issues or open a new one.

Capabilities Overview

library cheat sheet

The library consists of various components, each having its own folder and tests, designed to be as self-contained as possible. This enables seamless integration of subsets into other libraries, like Material Design Components and Android System UI. Some consumers do not require all components, for example, MDC doesn’t need quantization, scoring, image extraction.

Components Purpose
blend Interpolate, harmonize, animate, and gradate colors in HCT
contrast Measure contrast, obtain contrastful colors
dislike Check and fix universally disliked colors
dynamiccolor Obtain colors that adjust based on UI state (dark theme, style, preferences, contrast requirements, etc.)
hct A new color space (hue, chrome, tone) based on CAM16 x L*, that accounts for viewing conditions
palettes Tonal palette — range of colors that varies only in tone

Core palette — set of tonal palettes needed to create Material color schemes | | quantize | Turn an image into N colors; composed of Celebi, which runs Wu, then WSMeans | | scheme | Create static and dynamic color schemes from a single color or a core palette | | score | Rank colors for suitability for theming | | temperature | Obtain analogous and complementary colors | | utilities | Color — convert between color spaces needed to implement HCT/CAM16

Math — functions for ex. ensuring hue is between 0 and 360, clamping, etc.

String - convert between strings and integers |

Learn about color science

The Science of Color & Design - Material Design

Try it out

Material Theme Builder

We recommend incorporating the Material Theme Builder Figma plugin and web tool into the design workflow. With them, designers can easily experiment with different dynamic color themes and see how they transform their designs with just a few clicks.

Extension points exported contracts — how you extend this code

PointProvider (Interface)
An interface to allow use of different color spaces by quantizers. */ [6 implementers]
kotlin/quantize/PointProvider.kt
ColorCalculationDelegate (Interface)
* A delegate that provides the HCT and tone of a DynamicColor. * * This is used to allow different implementations of [11 …
typescript/dynamiccolor/dynamic_color.ts
PointProvider (Interface)
An interface to allow use of different color spaces by quantizers. [7 implementers]
java/quantize/PointProvider.java
PointProvider (Interface)
(no doc) [7 implementers]
typescript/quantize/point_provider.ts
ColorSpec (Interface)
An interface defining all the necessary methods that could be different between specs. [2 implementers]
java/dynamiccolor/ColorSpec.java
ColorSpec (Interface)
An interface defining all the necessary methods that could be different between specs. */ [1 implementers]
kotlin/dynamiccolor/ColorSpec.kt
CustomColor (Interface)
(no doc)
typescript/utils/theme_utils.ts
CorePaletteColors (Interface)
(no doc)
typescript/palettes/core_palette.ts

Core symbols most depended-on inside this repo

build
called by 259
java/dynamiccolor/DynamicColor.java
extendSpecVersion
called by 189
java/dynamiccolor/DynamicColor.java
get
called by 165
java/dynamiccolor/ColorSpecs.java
setName
called by 165
java/dynamiccolor/DynamicColor.java
setPalette
called by 154
java/dynamiccolor/DynamicColor.java
fromPalette
called by 146
typescript/dynamiccolor/dynamic_color.ts
tone
called by 128
typescript/hct/hct.ts
setTone
called by 118
java/dynamiccolor/DynamicColor.java

Shape

Method 1,655
Class 223
Function 181
Interface 19
Enum 10

Languages

Java38%
TypeScript36%
C++15%
Kotlin11%

Modules by API surface

java/scheme/Scheme.java98 symbols
typescript/dynamiccolor/dynamic_scheme.ts91 symbols
java/dynamiccolor/ColorSpec2021.java80 symbols
java/dynamiccolor/ColorSpec.java78 symbols
java/dynamiccolor/DynamicScheme.java72 symbols
java/dynamiccolor/ColorSpec2025.java71 symbols
java/dynamiccolor/MaterialDynamicColors.java70 symbols
typescript/dynamiccolor/color_spec_2021.ts65 symbols
typescript/dynamiccolor/material_dynamic_colors.ts62 symbols
typescript/dynamiccolor/color_spec.ts61 symbols
cpp/dynamiccolor/material_dynamic_colors.cc60 symbols
typescript/dynamiccolor/color_spec_2025.ts57 symbols

For agents

$ claude mcp add material-color-utilities \
  -- python -m otcore.mcp_server <graph>

⬇ download graph artifact

Ask about this repo answers extend the page