@nexub/brand 2.0.0 → 2.1.0

package/README.md

@@ -16,6 +16,8 @@ pnpm add @nexub/brand
 | `app-icon-<product>.svg`, `-192.png`, `-512.png` | Each Nexub app's tile, same tile with its own glyph: `command-hub` (a hub of agents), `admin` (a shield), `people` (two people), `payhub` (a banknote), `commerce` (a shopping bag), `contracts` (a signed page), `leap` (a leap forward), `founder-hub` (a rocket). |
 | `app-icon[-<product>]-light.svg` | Every tile again in white glass, for light themes. The black tiles are for dark themes. |
 | `favicon.ico` | 16, 32 and 48 px, from `app-icon.svg`. |
+| `mobile/<product>-ios.png` | iOS app icon: 1024 px, full bleed, opaque (iOS draws the corners). `<product>` is `nexub` for the hub or a product id. |
+| `mobile/<product>-android-{foreground,background,monochrome}.png` | Android adaptive icon layers (432 px), glyph inside the safe zone; `monochrome` for Android 13+ themed icons. |
 
 Every file is at `@nexub/brand/<file>` (the package maps `./*` to `assets/*`).
 
@@ -64,6 +66,23 @@ import accountIcon from '@nexub/brand/app-icon-account.svg';
 
 For the Account app, use the `app-icon-account*` files in those places.
 
+## Expo / React Native apps
+
+```json
+{
+  "expo": {
+    "icon": "./node_modules/@nexub/brand/assets/mobile/payhub-ios.png",
+    "android": {
+      "adaptiveIcon": {
+        "foregroundImage": "./node_modules/@nexub/brand/assets/mobile/payhub-android-foreground.png",
+        "backgroundImage": "./node_modules/@nexub/brand/assets/mobile/payhub-android-background.png",
+        "monochromeImage": "./node_modules/@nexub/brand/assets/mobile/payhub-android-monochrome.png"
+      }
+    }
+  }
+}
+```
+
 ## Plain static serving (no bundler)
 
 Copy the files next to your HTML as part of your deploy step, using the same `cpSync` line with your output folder (for example `dist/brand`). Then reference them as `/brand/<file>` exactly as above. Self-hosting keeps them same-origin, so a strict CSP (`img-src 'self'`) needs no changes.
@@ -76,7 +95,7 @@ Every product gets the same tile with its own glyph. Don't edit the tile itself.
 
 1. Draw the glyph as an SVG fragment in the 512 × 512 tile space and save it as `glyphs/<product>.svg`. Keep it inside roughly x/y 90–422, the area the Nexub mark uses. Gradients go in a `<defs>` inside the fragment; use `id="glyph"` (see `glyphs/account.svg`).
 2. Add `{ id: '<product>', glyph: read('glyphs/<product>.svg'), halo: '<hex>' }` to `PRODUCTS` in `scripts/build-assets.mjs`. `halo` tints the glow behind the glyph.
-3. Run `pnpm --filter @nexub/brand build:assets` and commit `assets/app-icon-<product>*` (it also writes the `-light.svg` tile).
+3. Run `pnpm --filter @nexub/brand build:assets` and commit `assets/app-icon-<product>*` and `assets/mobile/<product>-*` (it also writes the `-light.svg` tile and the mobile icon set).
 
 Use mid-tone gradient colours for a glyph (roughly Tailwind's 300 to 700 shades), so it reads on both the black and the white tile.
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nexub/brand",
-  "version": "2.0.0",
+  "version": "2.1.0",
   "description": "Official Nexub brand files: the Nexub mark (colour and mono SVG), app icon tiles, PNG icons and favicon.",
   "license": "MIT",
   "homepage": "https://github.com/Nexub-AI/nexub-ds#readme",