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

StreamDesign

object StreamDesign

The Stream Chat Design System namespace.

Provides all design tokens for theming Chat SDK components:

Use via ChatTheme:

ChatTheme(
    colors = StreamDesign.Colors.default().copy(accentPrimary = ...),
    typography = StreamDesign.Typography.default(fontFamily = ...),
) { content() }
Content copied to clipboard

Types

Link copied to clipboard
@Immutable
data class ChromeScale(val s0: Color, val s50: Color, val s100: Color, val s150: Color, val s200: Color, val s300: Color, val s400: Color, val s500: Color, val s600: Color, val s700: Color, val s800: Color, val s900: Color, val s1000: Color)

A 13-stop neutral ramp representing the chrome (structural gray) palette.

Link copied to clipboard
@Immutable
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.

Link copied to clipboard
@Immutable
data class ColorScale(val s50: Color, val s100: Color, val s150: Color, val s200: Color, val s300: Color, val s400: Color, val s500: Color, val s600: Color, val s700: Color, val s800: Color, val s900: Color)

An 11-stop color ramp representing the brand (accent) palette.

Link copied to clipboard
@Immutable
data class Typography(val bodyDefault: TextStyle, val bodyEmphasis: TextStyle, val captionDefault: TextStyle, val captionEmphasis: TextStyle, val headingExtraSmall: TextStyle, val headingSmall: TextStyle, val headingMedium: TextStyle, val headingLarge: TextStyle, val metadataDefault: TextStyle, val metadataEmphasis: TextStyle, val numericSmall: TextStyle, val numericMedium: TextStyle, val numericLarge: TextStyle, val numericExtraLarge: TextStyle)

Contains all the typography we provide for our components.