Skip to main content

​
Introducing CometChatColorPalette

The CometChatColorPalette class allows you to customize the colors used throughout your app. It works the same way in V6 as in V5 — you assign it to the extensions property of your ThemeData. Here’s what you can customize:
  • Primary Colors — Main color scheme of your app
  • Neutral Colors — Balanced base for visuals
  • Alert Colors — Informative, warning, success, and error messages
  • Background Colors — Background shades for different areas
  • Text Colors — Text element colors for readability
  • Border Colors — Borders for buttons and cards
  • Icon Colors — App icon colors
  • Button Colors — Button background and text colors
  • Shimmer Colors — Loading animation colors

​
Light Mode

ThemeData(
  extensions: [
    CometChatColorPalette(
      textSecondary: Color(0xFF727272),
      background1: Color(0xFFFFFFFF),
      textPrimary: Color(0xFF141414),
      borderLight: Color(0xFFF5F5F5),
      borderDark: Color(0xFFDCDCDC),
      iconSecondary: Color(0xFFA1A1A1),
      success: Color(0xFF09C26F),
      iconHighlight: Color(0xFF6852D6),
      extendedPrimary500: Color(0xFFAA9EE8),
      warning: Color(0xFFFAAB00),
      messageSeen: Color(0xFF56E8A7),
      neutral900: Color(0xFF141414),
      neutral600: Color(0xFF727272),
      neutral300: Color(0xFFE8E8E8),
      primary: Color(0xFF6852D6),
    ),
  ],
)

​
Dark Mode

ThemeData(
  extensions: [
    CometChatColorPalette(
      textSecondary: Color(0xFF989898),
      background1: Color(0xFF1A1A1A),
      textPrimary: Color(0xFFFFFFFF),
      borderLight: Color(0xFF272727),
      iconSecondary: Color(0xFF858585),
      success: Color(0xFF0B9F5D),
      iconHighlight: Color(0xFF6852D6),
      extendedPrimary500: Color(0xFF3E3180),
      warning: Color(0xFFD08D04),
      messageSeen: Color(0xFF56E8A7),
      neutral900: Color(0xFFFFFFFF),
      neutral600: Color(0xFF989898),
      neutral300: Color(0xFF383838),
      primary: Color(0xFF6852D6),
    ),
  ],
)

​
Custom Colors

ThemeData(
  extensions: [
    CometChatColorPalette(
      textSecondary: Color(0xFF727272),
      background1: Color(0xFFFFFFFF),
      textPrimary: Color(0xFF141414),
      borderLight: Color(0xFFF5F5F5),
      borderDark: Color(0xFFDCDCDC),
      iconSecondary: Color(0xFFA1A1A1),
      success: Color(0xFF09C26F),
      iconHighlight: Color(0xFFF76808),
      extendedPrimary500: Color(0xFFFBAA75),
      warning: Color(0xFFFAAB00),
      messageSeen: Color(0xFF56E8A7),
      neutral900: Color(0xFF141414),
      neutral600: Color(0xFF727272),
      neutral300: Color(0xFFE8E8E8),
      primary: Color(0xFFF76808),
    ),
  ],
)