animateFluentColors
Animates the accent ramp behind colors so a change of seed fades rather than jumps.
val colors = animateFluentColors(rememberFluentColors(seedColor = ThemeSettings.seedColor))
FluentTheme(colors = colors) {
Button(onClick = { ThemeSettings.seedColor = Color(0xFF00695C) }) {
Text("Teal")
}
}Only the seven shades animate, and that is the whole of what Fluent exposes. Every field on Colors has an internal set and the twelve groups are derived in the constructor, so a new Colors is built each frame from the seven colors as they move. The groups that come from the ramp follow along. The ones built from Fluent's own constants, system and controlOnImage, hold still because nothing in them ever depended on the accent.
Flipping Colors.darkMode is a cut rather than a fade for the same reason. Fluent derives light and dark from the shades and a flag, and the flag cannot fade. From SPEC_2025 the scheme's ramp changes with the mode, so the shades cut along with the flag. Animating them would pair the dark flag with light tones until the spring settled.
Return
Colors whose ramp tracks colors over time.
Parameters
The colors to animate towards, usually from rememberFluentColors.
How each of the seven shades animates.
A debugging label for the transition.