stream-chat-android-compose/io.getstream.chat.android.compose.ui.theme/StreamDesign/Colors

Colors

data class Colors(val brand: StreamDesign.ColorScale, val chrome: StreamDesign.ChromeScale, val accentPrimary: Color, val accentError: Color, val accentSuccess: Color, val accentWarning: Color, val accentNeutral: Color, val textPrimary: Color, val textSecondary: Color, val textTertiary: Color, val textDisabled: Color, val textOnAccent: Color, val textOnInverse: Color, val textLink: Color, val backgroundCoreElevation0: Color, val backgroundCoreElevation1: Color, val backgroundCoreElevation2: Color, val backgroundCoreElevation3: Color, val backgroundCoreSurfaceDefault: Color, val backgroundCoreSurfaceSubtle: Color, val backgroundCoreSurfaceStrong: Color, val backgroundCoreSurfaceCard: Color, val backgroundCoreInverse: Color, val backgroundCoreOnAccent: Color, val backgroundCoreScrim: Color, val backgroundCoreOverlayDark: Color, val backgroundCoreOverlayLight: Color, val backgroundCoreHighlight: Color, val backgroundCoreApp: Color, val backgroundUtilitySelected: Color, val backgroundUtilityDisabled: Color, val borderCoreDefault: Color, val borderCoreStrong: Color, val borderCoreSubtle: Color, val borderCoreOpacitySubtle: Color, val borderCoreOpacityStrong: Color, val borderCoreOnAccent: Color, val borderCoreOnInverse: Color, val borderCoreOnSurface: Color, val borderUtilitySelected: Color, val borderUtilityFocused: Color, val borderUtilityActive: Color, val borderUtilityDisabled: Color, val borderUtilityDisabledOnSurface: Color, val borderUtilityError: Color, val borderUtilityWarning: Color, val borderUtilitySuccess: Color, val avatarBgPlaceholder: Color, val avatarPaletteBg1: Color, val avatarPaletteBg2: Color, val avatarPaletteBg3: Color, val avatarPaletteBg4: Color, val avatarPaletteBg5: Color, val avatarPaletteText1: Color, val avatarPaletteText2: Color, val avatarPaletteText3: Color, val avatarPaletteText4: Color, val avatarPaletteText5: Color, val avatarTextPlaceholder: Color, val avatarPresenceBorder: Color, val skeletonLoadingBase: Color, val skeletonLoadingHighlight: Color, val systemCaret: Color)

Semantic color tokens for theming Chat SDK components. Customize via default / defaultDark factory parameters or copy.

Parameters are organized by domain: scales → accent → text → background → border → avatar → skeleton.

Parameters

brand

The brand (accent) color scale. See ColorScale.

chrome

The chrome (neutral gray) color scale. See ChromeScale.

accentPrimary

Main brand accent for interactive elements.

accentError

Destructive actions and error states.

accentSuccess

Success states and positive actions.

accentWarning

Warning or caution messages.

accentNeutral

Neutral accent for low-priority badges.

textPrimary

Main text color.

textSecondary

Secondary metadata text.

textTertiary

Lowest priority text.

textDisabled

Disabled text.

textOnAccent

Text on dark or accent backgrounds.

textOnInverse

Text on inverse backgrounds.

textLink

Hyperlinks and inline actions.

backgroundCoreElevation0

Flat surfaces.

backgroundCoreElevation1

Slightly elevated surfaces.

backgroundCoreElevation2

Card-like elements.

backgroundCoreElevation3

Popovers.

backgroundCoreSurfaceDefault

Standard section background.

backgroundCoreSurfaceSubtle

Very light section background.

backgroundCoreSurfaceStrong

Stronger section background.

backgroundCoreSurfaceCard

Card surfaces inside elevated containers like sheets and dialogs. In dark mode, resolves lighter than the container background to maintain separation.

backgroundCoreInverse

Inverse background for elevated, transient, or high-attention UI surfaces that sit on top of the default app background.

backgroundCoreOnAccent

Surfaces that must remain white across themes (e.g., media controls over video). Do not use for general UI surfaces.

backgroundCoreScrim

Dimmed overlay for modals.

backgroundCoreOverlayDark

Selected overlay (dark variant).

backgroundCoreOverlayLight

Selected overlay (light variant).

backgroundCoreHighlight

Highlight background (e.g. message focus/pin).

backgroundCoreApp

Global application background.

backgroundUtilitySelected

Selected overlay.

backgroundUtilityDisabled

Disabled backgrounds.

borderCoreDefault

Standard surface border.

borderCoreStrong

Stronger surface border.

borderCoreSubtle

Very light separators.

borderCoreOpacitySubtle

Image frame border treatment (subtle).

borderCoreOpacityStrong

Image frame border treatment (strong).

borderCoreOnAccent

Borders on accent backgrounds.

borderCoreOnInverse

Border on inverse backgrounds.

borderCoreOnSurface

Border for elements sitting on elevated surfaces.

borderUtilitySelected

Selected overlay border.

borderUtilityFocused

Focus ring or focus border.

borderUtilityActive

Active state focus border.

borderUtilityDisabled

Optional disabled border for inputs, buttons, or chips.

borderUtilityDisabledOnSurface

Border for disabled elements on elevated surfaces.

borderUtilityError

Error state border.

borderUtilityWarning

Warning state border.

borderUtilitySuccess

Success state border.

avatarBgPlaceholder

Avatar placeholder background.

avatarPaletteBg1

Avatar background (slot 1).

avatarPaletteBg2

Avatar background (slot 2).

avatarPaletteBg3

Avatar background (slot 3).

avatarPaletteBg4

Avatar background (slot 4).

avatarPaletteBg5

Avatar background (slot 5).

avatarPaletteText1

Avatar text (slot 1).

avatarPaletteText2

Avatar text (slot 2).

avatarPaletteText3

Avatar text (slot 3).

avatarPaletteText4

Avatar text (slot 4).

avatarPaletteText5

Avatar text (slot 5).

avatarTextPlaceholder

Avatar placeholder text.

avatarPresenceBorder

The thin outline around the presence dot. Matches the local surface behind the avatar.

skeletonLoadingBase

Base color for the skeleton loading gradient (placeholder surfaces).

skeletonLoadingHighlight

Highlight for the skeleton loading gradient (moving shimmer).

systemCaret

System caret color.

Constructors

Colors

constructor(brand: StreamDesign.ColorScale, chrome: StreamDesign.ChromeScale, accentPrimary: Color, accentError: Color, accentSuccess: Color, accentWarning: Color, accentNeutral: Color, textPrimary: Color, textSecondary: Color, textTertiary: Color, textDisabled: Color, textOnAccent: Color, textOnInverse: Color, textLink: Color, backgroundCoreElevation0: Color, backgroundCoreElevation1: Color, backgroundCoreElevation2: Color, backgroundCoreElevation3: Color, backgroundCoreSurfaceDefault: Color, backgroundCoreSurfaceSubtle: Color, backgroundCoreSurfaceStrong: Color, backgroundCoreSurfaceCard: Color, backgroundCoreInverse: Color, backgroundCoreOnAccent: Color, backgroundCoreScrim: Color, backgroundCoreOverlayDark: Color, backgroundCoreOverlayLight: Color, backgroundCoreHighlight: Color, backgroundCoreApp: Color, backgroundUtilitySelected: Color, backgroundUtilityDisabled: Color, borderCoreDefault: Color, borderCoreStrong: Color, borderCoreSubtle: Color, borderCoreOpacitySubtle: Color, borderCoreOpacityStrong: Color, borderCoreOnAccent: Color, borderCoreOnInverse: Color, borderCoreOnSurface: Color, borderUtilitySelected: Color, borderUtilityFocused: Color, borderUtilityActive: Color, borderUtilityDisabled: Color, borderUtilityDisabledOnSurface: Color, borderUtilityError: Color, borderUtilityWarning: Color, borderUtilitySuccess: Color, avatarBgPlaceholder: Color, avatarPaletteBg1: Color, avatarPaletteBg2: Color, avatarPaletteBg3: Color, avatarPaletteBg4: Color, avatarPaletteBg5: Color, avatarPaletteText1: Color, avatarPaletteText2: Color, avatarPaletteText3: Color, avatarPaletteText4: Color, avatarPaletteText5: Color, avatarTextPlaceholder: Color, avatarPresenceBorder: Color, skeletonLoadingBase: Color, skeletonLoadingHighlight: Color, systemCaret: Color)