cometchat-react-native-customization

cometchat-react-native-customization is a skill for Claude Code from cometchat/cometchat-skills. It costs 100 tokens per session (2,386 once invoked), scanned A, original, MIT.

A customization guide for CometChat's React Native chat interface. It covers themes, colors, component styles, added controls, and custom message displays.

In plain words
What is it for?
Use it to add light or dark mode, change chat colors, restyle message bubbles, and insert custom content or message types. React Native is a framework for building mobile apps with JavaScript.
Why use it?
It avoids applying web CSS to a mobile interface that does not use stylesheets or class names. It gives the app's chat screens a consistent appearance without replacing the whole interface.

Skill for Claude Code

Written for Claude Code: shipped in a Claude Code plugin.

Part of the cometchat-skills plugin — 98 skills, 1 MCP server shipped together

Good fit Use it to add light or dark mode, change chat colors, restyle message bubbles, and insert custom content or message types. React Native is a framework for building mobile apps with JavaScript.

Compare 6 skills from other repositories ↓
Install with agentmods
npx agentmods add skills/cometchat/cometchat-skills/cometchat-react-native-customization
Install

Getting it into your agent

One page per mod, every tool's command on it. A separate URL per tool would split the same page into five that compete with each other.

Any agent
npx skills add cometchat/cometchat-skills --skill cometchat-react-native-customization
Clone the repo
git clone --depth 1 https://github.com/cometchat/cometchat-skills

Made for: Claude Code.

Or install cometchat-skills, the plugin that ships this one along with the rest of its 98 skills, 1 MCP server.

Wrote this? Show the measurements

A badge with what this costs and how it scanned, read live from this page, so it follows the numbers instead of freezing them. Markdown for a README, HTML for a documentation site or a project page.

agentmods badge for cometchat-react-native-customization

README.md
[![agentmods](https://agentmods.dev/badge/skills/cometchat/cometchat-skills/cometchat-react-native-customization/github.svg)](https://agentmods.dev/skills/cometchat/cometchat-skills/cometchat-react-native-customization)
Your own site
<a href="https://agentmods.dev/skills/cometchat/cometchat-skills/cometchat-react-native-customization"><img src="https://agentmods.dev/badge/skills/cometchat/cometchat-skills/cometchat-react-native-customization/github.svg" alt="Measured on agentmods" height="20"></a>

Or the 80×15 button, for a site that already has a row of RSS and ATOM ones. Only the verdict fits; the numbers stay here.

agentmods 80×15 button for cometchat-react-native-customization

Your own site · 80×15
<a href="https://agentmods.dev/skills/cometchat/cometchat-skills/cometchat-react-native-customization"><img src="https://agentmods.dev/badge/skills/cometchat/cometchat-skills/cometchat-react-native-customization.svg" alt="Reviewed on agentmods" width="80" height="20"></a>
Per session 100 Skills are progressive disclosure: only the name and description are preloaded; the body loads when the skill is used.
When invoked 2,386 The whole file, excluding the scripts and references it only reads on demand.
Security scan A 0 findings. A grade says what 26 rules found in the file — not that it is safe.
Origin original No closer match found in the catalogue.
Token cost

What it costs to keep this loaded

Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.

ModelPer sessionOnce invoked
Fable 5.1 $0.00100 $0.02386
Opus 5.5 $0.00040 $0.00954
Sonnet 5.5 $0.00020 $0.00477
Haiku 4.5 $0.00010 $0.00239

Measured 1mo ago against content hash 3d8b1a106cff, method: parsed. Prices are Anthropic first-party input rates as of 2026-10-07, from the pricing page.

Security

Grade A, and why

cometchat-react-native-customization scanned grade A with 0 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 1mo ago.

A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.

Nothing flagged

None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.

skills/cometchat-react-native-customization/SKILL.md · 199 lines

How it starts

The opening of the file, as written. The whole thing — 199 lines — stays where its author put it; the contents beside it link to each section on GitHub.

Ground truth: @cometchat/chat-uikit-react-native@5 + catalog rn-v5.json. Docs: /ui-kit/react-native/theme · colors · component-styling · message-bubble-styling. Fetch token names and style keys from docs — never invent them.

Companion skills (read first)

  • cometchat-react-native-core — install, provider chain, init→login→render. Assumed, not repeated here.

Use this skill when

  • "change the chat colors" · "brand the chat UI" · "dark mode" · "restyle the bubbles"
  • "custom message type" · "render my own bubble" · "add an option to the message menu"

Prerequisites & install

None beyond core. Theming needs CometChatThemeProvider already in the chain (see core).

Customization mechanism — three layers, cheapest first

There is no CSS. No stylesheets, no className, no --cometchat-* variables. If you are holding a React snippet with CSS custom properties, it does not apply here.

Layer 1 — theme mode + color tokens (whole app)

The provider takes a theme prop shaped { mode, light, dark }. mode is "light" · "dark" · "auto" — "auto" is what makes the kit follow the device (OS) light/dark setting (it reads useColorScheme()); the provider default is already "auto".

// Fixed dark for the whole app.
<CometChatThemeProvider theme={{ mode: "dark" }}>{/* … */}</CometChatThemeProvider>
// Follow the OS, branded in BOTH schemes. mode:"auto" is the switch;
// set BOTH light and dark or dark falls back to defaults.
<CometChatThemeProvider
  theme={{
    mode: "auto",
    light: { color: { primary: "#F76808" } },
    dark: { color: { primary: "#F8935B" } },
  }}
>
  {/* … */}
</CometChatThemeProvider>

primary drives buttons, outgoing bubbles and active states — it is usually the only token a brand change needs. Other common tokens: textPrimary, background1, neutral50, extendedPrimary500. Fetch the full list from /ui-kit/react-native/colors.md rather than guessing a token name.

Read the full file on GitHub · 199 lines

Changes

What this file has done since we first saw it

Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.

  1. 1mo ago First seen · 199 lines · 100 tokens per session scan A 3d8b1a106cff

Subscribe to this mod's changes

cometchat-react-native-customization is a skill published in the GitHub repository cometchat/cometchat-skills (157 stars, last pushed 12d ago), licensed MIT. It adds 100 tokens to every session and 2,386 once invoked, about $0.0004 per session on Opus 5.5. A static security scan graded it A with 0 findings. No closer match exists in the catalogue, so it is treated as the original; first seen 2026-09-12.

Related

Other skills, from other repositories

reverse-engineering-android-malware-with-jadx

Reverse engineers malicious Android APK files using JADX decompiler to analyze Java/Kotlin source code, identify malicious functionality including data theft, C2 communication, privilege escalation, and overlay attacks. Examines manifest permissions, receivers, services, and native libraries. Activates for requests…

adriannoes/awesome-agentic-ai · 82 tokens

flutter-codestyle

Custom Instructions: Senior Flutter & Dart Engineer.

GulajavaMinistudio/awesome-copilot-id · 13 tokens

ios-builder

Turn an Apple app idea into a concrete implementation using Swift, Apple technology references, release notes, and separately editable Icon Composer layers. Use for creating or extending native Apple apps; requires a coding environment for file edits and Xcode for iOS builds.

Nagarjuna2997/ios-agent-skill · 53 tokens

apple-hig-sf-symbols

Use when choosing, reviewing, or implementing SF Symbols in an Apple-platform app — picking meaningful symbols, keeping the same concept on the same symbol everywhere, and handling variants, rendering modes, and accessibility.

aka-kika/akakika-skills · 48 tokens

apple-app-intents

Use when exposing app features to App Intents, Shortcuts, Siri, Spotlight, widgets, controls, or system actions — small safe AppIntents, AppShortcutsProvider, AppEnum/AppEntity, parameters, and open-vs-background behavior.

aka-kika/akakika-skills · 55 tokens

macos-permissions-privacy

Use when a macOS app needs a TCC permission or touches private data — the map of which API, Info.plist key, and entitlement each permission needs, pre-prompt explanation patterns, denied-state recovery with System Settings deep links, and honest privacy copy.

aka-kika/akakika-skills · 60 tokens