spark/com.adevinta.spark.tokens/SparkColors

SparkColors

class SparkColors(accent: Color, onAccent: Color, accentContainer: Color, onAccentContainer: Color, accentVariant: Color, onAccentVariant: Color, basic: Color, onBasic: Color, basicContainer: Color, onBasicContainer: Color, main: Color, onMain: Color, mainContainer: Color, onMainContainer: Color, mainVariant: Color, onMainVariant: Color, support: Color, onSupport: Color, supportContainer: Color, onSupportContainer: Color, supportVariant: Color, onSupportVariant: Color, success: Color, onSuccess: Color, successContainer: Color, onSuccessContainer: Color, alert: Color, onAlert: Color, alertContainer: Color, onAlertContainer: Color, error: Color, onError: Color, errorContainer: Color, onErrorContainer: Color, info: Color, onInfo: Color, infoContainer: Color, onInfoContainer: Color, neutral: Color, onNeutral: Color, neutralContainer: Color, onNeutralContainer: Color, background: Color, onBackground: Color, backgroundVariant: Color, onBackgroundVariant: Color, surface: Color, onSurface: Color, surfaceInverse: Color, onSurfaceInverse: Color, surfaceTint: Color, outline: Color, outlineHigh: Color, scrim: Color, dimContent1: Float, dimContent2: Float, dimContent3: Float, dimContent4: Float, dimContent5: Float)

A color scheme holds all the named color parameters for a SparkTheme highly inspired by Material 3 ColorScheme.

SparkColors are designed to be harmonious, ensure accessible text, and distinguish UI elements and surfaces from one another. There are two built-in baseline schemes, lightSparkColors and a darkSparkColors, that can be used as-is or customized.

To learn more about colors, see Material Design colors and Spark colors.

Constructors

SparkColors

constructor(accent: Color, onAccent: Color, accentContainer: Color, onAccentContainer: Color, accentVariant: Color, onAccentVariant: Color, basic: Color, onBasic: Color, basicContainer: Color, onBasicContainer: Color, main: Color, onMain: Color, mainContainer: Color, onMainContainer: Color, mainVariant: Color, onMainVariant: Color, support: Color, onSupport: Color, supportContainer: Color, onSupportContainer: Color, supportVariant: Color, onSupportVariant: Color, success: Color, onSuccess: Color, successContainer: Color, onSuccessContainer: Color, alert: Color, onAlert: Color, alertContainer: Color, onAlertContainer: Color, error: Color, onError: Color, errorContainer: Color, onErrorContainer: Color, info: Color, onInfo: Color, infoContainer: Color, onInfoContainer: Color, neutral: Color, onNeutral: Color, neutralContainer: Color, onNeutralContainer: Color, background: Color, onBackground: Color, backgroundVariant: Color, onBackgroundVariant: Color, surface: Color, onSurface: Color, surfaceInverse: Color, onSurfaceInverse: Color, surfaceTint: Color, outline: Color, outlineHigh: Color, scrim: Color, dimContent1: Float, dimContent2: Float, dimContent3: Float, dimContent4: Float, dimContent5: Float)

Properties

accent

var accent: Color

accentContainer

var accentContainer: Color

accentVariant

var accentVariant: Color

alert

var alert: Color

An emphasis color used to provide a warning feedback.

alertContainer

var alertContainer: Color

The preferred tonal color of warning containers.

background

var background: Color

The background color that appears behind scrollable content.

backgroundVariant

var backgroundVariant: Color

The background color that appears behind scrollable content.

basic

var basic: Color

basicContainer

var basicContainer: Color

dim1

var dim1: Float

An alpha used to apply a medium emphasis to text.

dim2

var dim2: Float

An alpha used to apply a medium emphasis to icons.

dim3

var dim3: Float

An alpha used to apply a disabled emphasis to all components.

dim4

var dim4: Float

An alpha used to show a low element.

dim5

var dim5: Float

An alpha used to apply a pressed/ripple visual but should not be used on Android.

error

var error: Color

The error color is used to indicate errors in components, such as invalid text in a text field.

errorContainer

var errorContainer: Color

The preferred tonal color of error containers.

info

var info: Color

An emphasis color used to provide an informative feedback.

infoContainer

var infoContainer: Color

The preferred tonal color of info containers.

main

var main: Color

The main color is the color displayed most frequently across your app’s screens and components.

mainContainer

var mainContainer: Color

The preferred tonal color of containers.

mainVariant

var mainVariant: Color

Darker variation of main color.

neutral

var neutral: Color

An emphasis color used to provide a neutral feedback.

neutralContainer

var neutralContainer: Color

The preferred tonal color of neutral containers.

onAccent

var onAccent: Color

onAccentContainer

var onAccentContainer: Color

onAccentVariant

var onAccentVariant: Color

onAlert

var onAlert: Color

Color used for text and icons displayed on top of the alert color.

onAlertContainer

var onAlertContainer: Color

Color used for text and icons displayed on top of the alertContainer color.

onBackground

var onBackground: Color

Color used for text and icons displayed on top of the background color.

onBackgroundVariant

var onBackgroundVariant: Color

Color used for text and icons displayed on top of the background color.

onBasic

var onBasic: Color

onBasicContainer

var onBasicContainer: Color

onError

var onError: Color

Color used for text and icons displayed on top of the error color.

onErrorContainer

var onErrorContainer: Color

The color (and state variants) that should be used for content on top of errorContainer.

onInfo

var onInfo: Color

Color used for text and icons displayed on top of the info color.

onInfoContainer

var onInfoContainer: Color

Color used for text and icons displayed on top of the infoContainer color.

onMain

var onMain: Color

Color used for text and icons displayed on top of the main color.

onMainContainer

var onMainContainer: Color

The color (and state variants) that should be used for content on top of mainContainer.

onMainVariant

var onMainVariant: Color

Color used for text and icons displayed on top of the mainVariant color.

onNeutral

var onNeutral: Color

Color used for text and icons displayed on top of the neutral color.

onNeutralContainer

var onNeutralContainer: Color

Color used for text and icons displayed on top of the neutralContainer color.

onSuccess

var onSuccess: Color

Color used for text and icons displayed on top of the success color.

onSuccessContainer

var onSuccessContainer: Color

Color used for text and icons displayed on top of the successContainer color.

onSupport

var onSupport: Color

Color used for text and icons displayed on top of the support color.

onSupportContainer

var onSupportContainer: Color

The color (and state variants) that should be used for content on top of supportContainer.

onSupportVariant

var onSupportVariant: Color

Color used for text and icons displayed on top of the supportVariant color.

onSurface

var onSurface: Color

Color used for text and icons displayed on top of the surface color.

onSurfaceInverse

var onSurfaceInverse: Color

outline

var outline: Color

Subtle color used for boundaries. Outline color role adds contrast for accessibility purposes.

outlineHigh

var outlineHigh: Color

Utility color used for boundaries for decorative elements when strong contrast is not required.

scrim

var scrim: Color

Color of a scrim that obscures content. On Android platforms, the scrim color and opacity is automatically handled by the system UI.

success

var success: Color

An emphasis color used to provide a positive feedback.

successContainer

var successContainer: Color

The preferred tonal color of success containers.

support

var support: Color

The support color provides more ways to accent and distinguish your product. Support colors are best for:

supportContainer

var supportContainer: Color

A tonal color to be used in containers.

supportVariant

var supportVariant: Color

Darker variation of support color.

surface

var surface: Color

The surface color that affect surfaces of components, such as cards, sheets, and menus.

surfaceInverse

var surfaceInverse: Color

Functions

applyTonalElevation

fun SparkColors.applyTonalElevation(backgroundColor: Color, elevation: Dp): Color

Returns the new background Color to use, representing the original background color with an overlay corresponding to elevation applied. The overlay will only be applied to ColorScheme.surface.

asMaterial3Colors

fun SparkColors.asMaterial3Colors(): ColorScheme

contentColorFor

fun SparkColors.contentColorFor(backgroundColor: Color): Color

The Material color system contains pairs of colors that are typically used for the background and content color inside a component. For example, a ButtonFilled typically uses main for its background, and onMain for the color of its content (usually text or iconography).

copy

fun copy(accent: Color = this.accent, onAccent: Color = this.onAccent, accentContainer: Color = this.accentContainer, onAccentContainer: Color = this.onAccentContainer, accentVariant: Color = this.accentVariant, onAccentVariant: Color = this.onAccentVariant, basic: Color = this.basic, onBasic: Color = this.onBasic, basicContainer: Color = this.basicContainer, onBasicContainer: Color = this.onBasicContainer, main: Color = this.main, onMain: Color = this.onMain, mainContainer: Color = this.mainContainer, onMainContainer: Color = this.onMainContainer, mainVariant: Color = this.mainVariant, onMainVariant: Color = this.onMainVariant, support: Color = this.support, onSupport: Color = this.onSupport, supportContainer: Color = this.supportContainer, onSupportContainer: Color = this.onSupportContainer, supportVariant: Color = this.supportVariant, onSupportVariant: Color = this.onSupportVariant, background: Color = this.background, onBackground: Color = this.onBackground, backgroundVariant: Color = this.backgroundVariant, onBackgroundVariant: Color = this.onBackgroundVariant, surface: Color = this.surface, onSurface: Color = this.onSurface, surfaceInverse: Color = this.surfaceInverse, onSurfaceInverse: Color = this.onSurfaceInverse, surfaceTint: Color = this.surfaceTint, outline: Color = this.outline, outlineHigh: Color = this.outlineHigh, scrim: Color = this.scrim, success: Color = this.success, onSuccess: Color = this.onSuccess, successContainer: Color = this.successContainer, onSuccessContainer: Color = this.onSuccessContainer, alert: Color = this.alert, onAlert: Color = this.onAlert, alertContainer: Color = this.alertContainer, onAlertContainer: Color = this.onAlertContainer, error: Color = this.error, onError: Color = this.onError, errorContainer: Color = this.errorContainer, onErrorContainer: Color = this.onErrorContainer, info: Color = this.info, onInfo: Color = this.onInfo, infoContainer: Color = this.infoContainer, onInfoContainer: Color = this.onInfoContainer, neutral: Color = this.neutral, onNeutral: Color = this.onNeutral, neutralContainer: Color = this.neutralContainer, onNeutralContainer: Color = this.onNeutralContainer, dimContent1: Float = this.dim1, dimContent2: Float = this.dim2, dimContent3: Float = this.dim3, dimContent4: Float = this.dim4, dimContent5: Float = this.dim5): SparkColors

Returns a copy of this Colors, optionally overriding some of the values.

surfaceColorAtElevation

fun SparkColors.surfaceColorAtElevation(elevation: Dp): Color

Computes the surface tonal color at different elevation levels e.g. surface1 through surface5.

toString

open override fun toString(): String