{"id":"26f53d82-1761-40ca-a8b6-533d511f456d","shortId":"wjBqkg","kind":"skill","title":"cometchat-android-v6-kotlin-theming","tagline":"CometChat Android UIKit v6 Kotlin Views theming — CometChatTheme singleton, XML attributes, programmatic overrides, typography, and dark mode","description":"> **Companion skills:** cometchat-android-v6-compose-theming (Compose equivalent), cometchat-android-v6-kotlin-components, cometchat-android-v6-kotlin-customization\n\n## Purpose\n\nApply and customize the CometChat theme in Kotlin Views — XML theme attributes, programmatic color/font overrides via the `CometChatTheme` singleton, dark mode support, and per-component style classes.\n\n## Use this skill when\n\n- Setting CometChat theme colors via XML attributes or programmatically\n- Overriding primary, neutral, alert, or button colors\n- Customizing typography and fonts\n- Implementing dark mode for Kotlin Views components\n- Clearing the theme cache after dynamic theme changes\n\n## Do not use this skill when\n\n- Working with Compose theming (use `cometchat-android-v6-compose-theming`)\n- Customizing bubble rendering (use `cometchat-android-v6-kotlin-customization`)\n\n## 1. CometChatTheme Singleton\n\n`CometChatTheme` is a Kotlin `object` in `com.cometchat.uikit.kotlin.theme` that provides `Context`-based getters and setters for all theme tokens.\n\n```kotlin\nimport com.cometchat.uikit.kotlin.theme.CometChatTheme\n\n// Get a color (requires Context)\nval primaryColor: Int = CometChatTheme.getPrimaryColor(context)\nval textColor: Int = CometChatTheme.getTextColorPrimary(context)\n\n// Set a color programmatically (cached globally)\nCometChatTheme.setPrimaryColor(Color.parseColor(\"#6851D6\"))\nCometChatTheme.setErrorColor(Color.RED)\n```\n\n## 2. XML Theme Attributes\n\nDefine theme colors in your app's `styles.xml` or `themes.xml`:\n\n```xml\n<style name=\"AppTheme\" parent=\"Theme.MaterialComponents.DayNight\">\n    <!-- Primary -->\n    <item name=\"cometchatPrimaryColor\">#6851D6</item>\n\n    <!-- Neutral scale -->\n    <item name=\"cometchatNeutralColor50\">#FAFAFA</item>\n    <item name=\"cometchatNeutralColor100\">#F5F5F5</item>\n    <item name=\"cometchatNeutralColor200\">#E8E8E8</item>\n    <!-- ... through cometchatNeutralColor900 -->\n\n    <!-- Alert colors -->\n    <item name=\"cometchatSuccessColor\">#34C759</item>\n    <item name=\"cometchatErrorColor\">#FF3B30</item>\n    <item name=\"cometchatWarningColor\">#FFCC00</item>\n    <item name=\"cometchatInfoColor\">#007AFF</item>\n    <item name=\"cometchatMessageReadColor\">#007AFF</item>\n\n    <!-- Background colors -->\n    <item name=\"cometchatBackgroundColor1\">@color/bg1</item>\n    <!-- ... through cometchatBackgroundColor4 -->\n\n    <!-- Stroke/border colors -->\n    <item name=\"cometchatStrokeColorDefault\">@color/stroke</item>\n    <item name=\"cometchatStrokeColorLight\">@color/strokeLight</item>\n    <item name=\"cometchatStrokeColorDark\">@color/strokeDark</item>\n    <item name=\"cometchatStrokeColorHighlight\">@color/primary</item>\n\n    <!-- Text colors -->\n    <item name=\"cometchatTextColorPrimary\">@color/textPrimary</item>\n    <item name=\"cometchatTextColorSecondary\">@color/textSecondary</item>\n    <!-- ... -->\n\n    <!-- Icon tints -->\n    <item name=\"cometchatIconTintPrimary\">@color/iconPrimary</item>\n    <!-- ... -->\n\n    <!-- Button colors -->\n    <item name=\"cometchatPrimaryButtonBackgroundColor\">@color/primary</item>\n    <item name=\"cometchatPrimaryButtonIconTint\">@color/white</item>\n    <item name=\"cometchatPrimaryButtonTextColor\">@color/white</item>\n    <!-- ... -->\n</style>\n```\n\n## 3. Color Token Reference\n\n### 3.1 Primary Colors\n\n| Getter | Setter | XML Attr |\n|---|---|---|\n| `getPrimaryColor(ctx)` | `setPrimaryColor(color)` | `cometchatPrimaryColor` |\n\n### 3.2 Extended Primary (auto-generated from primary)\n\n| Getter | Setter | XML Attr |\n|---|---|---|\n| `getExtendedPrimaryColor50(ctx)` | `setExtendedPrimaryColor50(color)` | `cometchatExtendedPrimaryColor50` |\n| ... through 900 | ... | ... |\n\nExtended primary colors auto-generate by blending primary with white (day) or black (night) if not explicitly set.\n\n### 3.3 Neutral Colors\n\n`getNeutralColor50(ctx)` through `getNeutralColor900(ctx)` with corresponding setters and XML attrs `cometchatNeutralColor50` through `cometchatNeutralColor900`.\n\n### 3.4 Alert Colors\n\n| Getter | Setter | XML Attr |\n|---|---|---|\n| `getSuccessColor(ctx)` | `setSuccessColor(color)` | `cometchatSuccessColor` |\n| `getErrorColor(ctx)` | `setErrorColor(color)` | `cometchatErrorColor` |\n| `getWarningColor(ctx)` | `setWarningColor(color)` | `cometchatWarningColor` |\n| `getInfoColor(ctx)` | `setInfoColor(color)` | `cometchatInfoColor` |\n| `getMessageReadColor(ctx)` | `setMessageReadColor(color)` | `cometchatMessageReadColor` |\n\n### 3.5 Background, Stroke, Text, Icon, Button Colors\n\nAll follow the same pattern: `get{Token}(ctx)` / `set{Token}(color)` / `cometchat{Token}` XML attr. Defaults fall back to neutral scale values if not explicitly set.\n\nBorder color aliases: `getBorderColorLight()` = `getStrokeColorLight()`, etc.\n\n## 4. Typography\n\n```kotlin\n// Get text appearance resource IDs\nval titleBold: Int = CometChatTheme.getTextAppearanceTitleBold(context)\nval bodyRegular: Int = CometChatTheme.getTextAppearanceBodyRegular(context)\nval heading1Medium: Int = CometChatTheme.getTextAppearanceHeading1Medium(context)\n// ... all combinations: Title, Heading1-4, Body, Caption1-2, Button, Link × Regular/Medium/Bold\n\n// Get font resource IDs\nval regularFont: Int = CometChatTheme.getFontRegular(context)\nval mediumFont: Int = CometChatTheme.getFontMedium(context)\nval boldFont: Int = CometChatTheme.getFontBold(context)\n```\n\nOverride via XML attrs: `cometchatTextAppearanceTitleBold`, `cometchatFontRegular`, etc.\n\n## 5. Dark Mode\n\nDark mode is detected via `Configuration.UI_MODE_NIGHT_MASK`:\n\n```kotlin\nval nightMode = context.resources.configuration.uiMode and Configuration.UI_MODE_NIGHT_MASK\nval isDark = nightMode == Configuration.UI_MODE_NIGHT_YES\n```\n\nThe theme automatically:\n- Uses day/night qualified XML resources\n- Blends extended primary colors with white (day) or black (night)\n- Falls back to appropriate neutral scale for each mode\n\nFor programmatic overrides, set colors after detecting the mode:\n\n```kotlin\nif (isDark) {\n    CometChatTheme.setPrimaryColor(Color.parseColor(\"#BB86FC\"))\n} else {\n    CometChatTheme.setPrimaryColor(Color.parseColor(\"#6851D6\"))\n}\n```\n\n## 6. Theme Cache\n\nProgrammatic overrides are cached in memory. Clear the cache when the theme changes:\n\n```kotlin\nCometChatTheme.clearCache()\n```\n\nCall this when:\n- The user switches between light and dark mode at runtime\n- You dynamically change the primary color\n- The Activity recreates with a new theme\n\n## 7. Static Colors\n\n```kotlin\nval white: Int = CometChatTheme.getColorWhite(context)\nval black: Int = CometChatTheme.getColorBlack(context)\nval transparent: Int = CometChatTheme.getColorTransparent(context)\n```\n\n## Hard rules\n\n- ALWAYS pass a valid `Context` to getter methods — they resolve XML attributes from the theme\n- Call `CometChatTheme.clearCache()` after programmatic theme changes to ensure fresh values\n- Programmatic setters (`setPrimaryColor()`, etc.) take priority over XML attributes\n- Extended primary colors auto-generate from the primary color — only override them if you need specific shades\n- Do NOT mix Compose `CometChatTheme.colorScheme` with Views `CometChatTheme.getPrimaryColor(ctx)` — they are separate theme systems in separate modules","tags":["cometchat","android","kotlin","theming","skills","agent-skills","ai-agent","chat","claude-code","cursor","messaging","nextjs"],"capabilities":["skill","source-cometchat","skill-cometchat-android-v6-kotlin-theming","topic-agent-skills","topic-ai-agent","topic-chat","topic-claude-code","topic-cometchat","topic-cursor","topic-messaging","topic-nextjs","topic-react","topic-react-native","topic-ui-kit"],"categories":["cometchat-skills"],"synonyms":[],"warnings":[],"endpointUrl":"https://skills.sh/cometchat/cometchat-skills/cometchat-android-v6-kotlin-theming","protocol":"skill","transport":"skills-sh","auth":{"type":"none","details":{"cli":"npx skills add cometchat/cometchat-skills","source_repo":"https://github.com/cometchat/cometchat-skills","install_from":"skills.sh"}},"qualityScore":"0.463","qualityRationale":"deterministic score 0.46 from registry signals: · indexed on github topic:agent-skills · 27 github stars · SKILL.md body (7,160 chars)","verified":false,"liveness":"unknown","lastLivenessCheck":null,"agentReviews":{"count":0,"score_avg":null,"cost_usd_avg":null,"success_rate":null,"latency_p50_ms":null,"narrative_summary":null,"summary_updated_at":null},"enrichmentModel":"deterministic:skill-github:v1","enrichmentVersion":1,"enrichedAt":"2026-05-18T19:04:47.082Z","embedding":null,"createdAt":"2026-05-07T13:05:06.389Z","updatedAt":"2026-05-18T19:04:47.082Z","lastSeenAt":"2026-05-18T19:04:47.082Z","tsv":"'-2':378 '-4':375 '1':141 '2':191 '3':206 '3.1':210 '3.2':222 '3.3':260 '3.4':277 '3.5':309 '4':348 '5':408 '6':482 '6851d6':188,481 '7':526 '900':240 'activ':520 'alert':91,278 'alias':344 'alway':547 'android':3,8,28,36,42,127,137 'app':200 'appear':353 'appli':47 'appropri':457 'attr':216,233,273,283,330,404 'attribut':17,58,85,194,558,580 'auto':226,245,585 'auto-gener':225,244,584 'automat':438 'back':333,455 'background':310 'base':154 'bb86fc':477 'black':254,452,536 'blend':248,444 'bodi':376 'bodyregular':362 'boldfont':397 'border':342 'bubbl':132 'button':93,314,379 'cach':109,184,484,488,493 'call':500,562 'caption1':377 'chang':113,497,515,567 'class':74 'clear':106,491 'color':82,94,167,182,197,207,212,220,237,243,262,279,287,292,297,302,307,315,326,343,447,467,518,528,583,590 'color.parsecolor':187,476,480 'color.red':190 'color/font':60 'com.cometchat.uikit.kotlin.theme':150 'com.cometchat.uikit.kotlin.theme.cometchattheme':164 'combin':372 'cometchat':2,7,27,35,41,51,80,126,136,327 'cometchat-android-v6-compose-theming':26,125 'cometchat-android-v6-kotlin-components':34 'cometchat-android-v6-kotlin-customization':40,135 'cometchat-android-v6-kotlin-theming':1 'cometchaterrorcolor':293 'cometchatextendedprimarycolor50':238 'cometchatfontregular':406 'cometchatinfocolor':303 'cometchatmessagereadcolor':308 'cometchatneutralcolor50':274 'cometchatneutralcolor900':276 'cometchatprimarycolor':221 'cometchatsuccesscolor':288 'cometchattextappearancetitlebold':405 'cometchatthem':14,64,142,144 'cometchattheme.clearcache':499,563 'cometchattheme.colorscheme':603 'cometchattheme.getcolorblack':538 'cometchattheme.getcolortransparent':543 'cometchattheme.getcolorwhite':533 'cometchattheme.getfontbold':399 'cometchattheme.getfontmedium':394 'cometchattheme.getfontregular':389 'cometchattheme.getprimarycolor':173,606 'cometchattheme.gettextappearancebodyregular':364 'cometchattheme.gettextappearanceheading1medium':369 'cometchattheme.gettextappearancetitlebold':359 'cometchattheme.gettextcolorprimary':178 'cometchattheme.seterrorcolor':189 'cometchattheme.setprimarycolor':186,475,479 'cometchatwarningcolor':298 'companion':24 'compon':39,72,105 'compos':30,32,122,129,602 'configuration.ui':416,425,432 'context':153,169,174,179,360,365,370,390,395,400,534,539,544,551 'context.resources.configuration.uimode':423 'correspond':269 'ctx':218,235,264,267,285,290,295,300,305,323,607 'custom':45,49,95,131,140 'dark':22,66,100,409,411,509 'day':252,450 'day/night':440 'default':331 'defin':195 'detect':414,469 'dynam':111,514 'els':478 'ensur':569 'equival':33 'etc':347,407,575 'explicit':258,340 'extend':223,241,445,581 'fall':332,454 'follow':317 'font':98,383 'fresh':570 'generat':227,246,586 'get':165,321,351,382 'getbordercolorlight':345 'geterrorcolor':289 'getextendedprimarycolor50':234 'getinfocolor':299 'getmessagereadcolor':304 'getneutralcolor50':263 'getneutralcolor900':266 'getprimarycolor':217 'getstrokecolorlight':346 'getsuccesscolor':284 'getter':155,213,230,280,553 'getwarningcolor':294 'global':185 'hard':545 'heading1':374 'heading1medium':367 'icon':313 'id':355,385 'implement':99 'import':163 'int':172,177,358,363,368,388,393,398,532,537,542 'isdark':430,474 'kotlin':5,11,38,44,54,103,139,147,162,350,420,472,498,529 'light':507 'link':380 'mask':419,428 'mediumfont':392 'memori':490 'method':554 'mix':601 'mode':23,67,101,410,412,417,426,433,462,471,510 'modul':615 'need':596 'neutral':90,261,335,458 'new':524 'night':255,418,427,434,453 'nightmod':422,431 'object':148 'overrid':19,61,88,401,465,486,592 'pass':548 'pattern':320 'per':71 'per-compon':70 'primari':89,211,224,229,242,249,446,517,582,589 'primarycolor':171 'prioriti':577 'programmat':18,59,87,183,464,485,565,572 'provid':152 'purpos':46 'qualifi':441 'recreat':521 'refer':209 'regular/medium/bold':381 'regularfont':387 'render':133 'requir':168 'resolv':556 'resourc':354,384,443 'rule':546 'runtim':512 'scale':336,459 'separ':610,614 'set':79,180,259,324,341,466 'seterrorcolor':291 'setextendedprimarycolor50':236 'setinfocolor':301 'setmessagereadcolor':306 'setprimarycolor':219,574 'setsuccesscolor':286 'setter':157,214,231,270,281,573 'setwarningcolor':296 'shade':598 'singleton':15,65,143 'skill':25,77,118 'skill-cometchat-android-v6-kotlin-theming' 'source-cometchat' 'specif':597 'static':527 'stroke':311 'style':73 'styles.xml':202 'support':68 'switch':505 'system':612 'take':576 'text':312,352 'textcolor':176 'theme':6,13,31,52,57,81,108,112,123,130,160,193,196,437,483,496,525,561,566,611 'themes.xml':204 'titl':373 'titlebold':357 'token':161,208,322,325,328 'topic-agent-skills' 'topic-ai-agent' 'topic-chat' 'topic-claude-code' 'topic-cometchat' 'topic-cursor' 'topic-messaging' 'topic-nextjs' 'topic-react' 'topic-react-native' 'topic-ui-kit' 'transpar':541 'typographi':20,96,349 'uikit':9 'use':75,116,124,134,439 'user':504 'v6':4,10,29,37,43,128,138 'val':170,175,356,361,366,386,391,396,421,429,530,535,540 'valid':550 'valu':337,571 'via':62,83,402,415 'view':12,55,104,605 'white':251,449,531 'work':120 'xml':16,56,84,192,205,215,232,272,282,329,403,442,557,579 'yes':435","prices":[{"id":"f41a0911-03c5-4ca7-9c75-3238eb5cedca","listingId":"26f53d82-1761-40ca-a8b6-533d511f456d","amountUsd":"0","unit":"free","nativeCurrency":null,"nativeAmount":null,"chain":null,"payTo":null,"paymentMethod":"skill-free","isPrimary":true,"details":{"org":"cometchat","category":"cometchat-skills","install_from":"skills.sh"},"createdAt":"2026-05-07T13:05:06.389Z"}],"sources":[{"listingId":"26f53d82-1761-40ca-a8b6-533d511f456d","source":"github","sourceId":"cometchat/cometchat-skills/cometchat-android-v6-kotlin-theming","sourceUrl":"https://github.com/cometchat/cometchat-skills/tree/main/skills/cometchat-android-v6-kotlin-theming","isPrimary":false,"firstSeenAt":"2026-05-07T13:05:06.389Z","lastSeenAt":"2026-05-18T19:04:47.082Z"}],"details":{"listingId":"26f53d82-1761-40ca-a8b6-533d511f456d","quickStartSnippet":null,"exampleRequest":null,"exampleResponse":null,"schema":null,"openapiUrl":null,"agentsTxtUrl":null,"citations":[],"useCases":[],"bestFor":[],"notFor":[],"kindDetails":{"org":"cometchat","slug":"cometchat-android-v6-kotlin-theming","github":{"repo":"cometchat/cometchat-skills","stars":27,"topics":["agent-skills","ai-agent","chat","claude-code","cometchat","cursor","messaging","nextjs","react","react-native","ui-kit"],"license":null,"html_url":"https://github.com/cometchat/cometchat-skills","pushed_at":"2026-05-18T05:04:24Z","description":"Add CometChat chat to any React, Next.js, React Native, Angular, Android, iOS, or Flutter project through your AI coding agent. Works with Claude Code, Cursor, Codex, VS Code Copilot, Windsurf, Cline, Kiro, and 50+ more agents.","skill_md_sha":"8e71591eff0ff2be6ba94532543728efa9bbf528","skill_md_path":"skills/cometchat-android-v6-kotlin-theming/SKILL.md","default_branch":"main","skill_tree_url":"https://github.com/cometchat/cometchat-skills/tree/main/skills/cometchat-android-v6-kotlin-theming"},"layout":"multi","source":"github","category":"cometchat-skills","frontmatter":{"name":"cometchat-android-v6-kotlin-theming","license":"MIT","description":"CometChat Android UIKit v6 Kotlin Views theming — CometChatTheme singleton, XML attributes, programmatic overrides, typography, and dark mode","compatibility":"Android 9.0+ (API 28); Kotlin 1.9+; com.cometchat:chatuikit-kotlin-android:6.x"},"skills_sh_url":"https://skills.sh/cometchat/cometchat-skills/cometchat-android-v6-kotlin-theming"},"updatedAt":"2026-05-18T19:04:47.082Z"}}