# RahhalIcon

Cross-platform icon renderer. Parses the same prefixed catalog strings the iOS shell understands (`url:…`, `emoji:…`, `system:…`, `resource:…`, plus bare URLs/emojis) so a CMS-authored value paints identically on every client. Falls back to a muted square when the value is empty; `system:` and `resource:` render as debug tokens on the web because there's no SF Symbols / iOS bundle equivalent.

[View examples](https://marsam.rahhal.app/components/rahhal-icon) · [Agent index](https://marsam.rahhal.app/llms.txt)

**Import:** `@rahhal/ui/rahhal-icon`

**Category:** `tokens`

## Render the Rahhal brand icon

Use the [official Rahhal icon assets](https://marsam.rahhal.app/components/icons.md) when the request is for the Rahhal logo or app icon. This component renders a supplied icon value; it does not contain the logo by default.

```tsx
import { RahhalIcon } from "@rahhal/ui/rahhal-icon";

<RahhalIcon icon="url:https://marsam.rahhal.app/brand/app-icon-light.png" size={48} alt="Rahhal" />
```

Pass the dark asset URL for dark surfaces. Theme selection is the caller's responsibility.