# fix\(mobile\): projects without a favicon show a monogram, like desktop · PR \#22481 · pingdotgg/t3code

[View on GitCafe](https://git.cafe/pingdotgg/t3code/pull/22481)

Repository: [pingdotgg/t3code](https://git.cafe/pingdotgg/t3code)

Visibility: public

State: closed

Source repository: Unavailable fork

Source branch: fix/mobile-project-monogram-fallback-stacked

Target branch: main

Head commit: fd101156b0fbd6897f982b2a76e4940f2a944e29

[Discussion and reviews](https://git.cafe/pingdotgg/t3code/pull/22481)

[Commits](https://git.cafe/pingdotgg/t3code/pull/22481/commits?format=markdown)

[Files changed](https://git.cafe/pingdotgg/t3code/pull/22481/diffs?format=markdown)

## Description

---

> [!NOTE]
> 🤖 **Claude Opus 5.5 on behalf of Oliver**

> [!IMPORTANT]
> **Stacked PR 3 of 4.** Review and merge in this order:
>
> 1. #22237: Thread links in chat render as chips
> 2. #22243: Thread chips show the thread's project icon
> 3. **#22481: Projects without a favicon show a monogram, like desktop ← this PR**
> 4. #22585: Chat and composer chips stay readable in light mode
>
> Every PR in the stack targets `main` because the branches live on a fork, so this diff also includes #22237 and #22243. To review only this PR's changes, use [this comparison](https://github.com/flamboh/t3code/compare/feat/mobile-thread-chip-project-icons...fix/mobile-project-monogram-fallback-stacked).
>
> When a PR earlier in the stack merges, I rebase the ones after it onto `main`.

## Problem

On desktop, a project with no favicon and no custom icon shows an automatic monogram tile (initials on a color derived from the project name). On mobile, the same project shows a generic folder in the thread list, sidebar, project pickers, settings and archive. That makes these projects hard to tell apart, and it doesn't match desktop. The mobile command palette went further and showed a folder for every project, even ones with a favicon or a custom icon.

## Fix

- `ProjectFavicon` now falls back to desktop's monogram, using the same `ProjectIconGlyphView` tile mobile already uses for custom monograms. The text and color come from `projectAutoMonogram`, a small helper in `lib/projectIcon.ts` built on the `projectMonogram` / `projectMonogramColor` functions that #22243 added for thread chips. The chips now call the same helper, so a project gets the same color on desktop, in chips and everywhere else on mobile.
- The monogram also shows while a favicon is loading and when it fails to load. The image swaps in once it has loaded, as on desktop, and the tile keeps the same size so nothing shifts.
- The folder stays only for a project with a blank name, matching desktop's `ProjectFaviconFallback`.
- The command palette's project rows render `ProjectFavicon` instead of a fixed folder symbol.

Custom monogram, emoji and Lucide icons behave as before.

## Surfaces

Everything that renders `ProjectFavicon`: the thread list and iPad sidebar rows (including pending tasks), the new-task project picker, project settings, and the archive. Plus the command palette (hardware keyboard), which didn't use `ProjectFavicon` before.

[#22243](https://github.com/pingdotgg/t3code/pull/22243)'s Limitations section says mobile thread lists still show a folder for projects without a favicon. That's no longer true once this PR lands.

## Limitations

- The thread list's "All projects" filter is a native menu, which shows no project icons on mobile at all. [#11370](https://github.com/pingdotgg/t3code/pull/11370) covers favicons there; this PR doesn't touch it.
- Threads without a project keep their own treatment. [#21546](https://github.com/pingdotgg/t3code/pull/21546) maps the no-project folder's Lucide icon to a chat bubble. That path goes through `resolveProjectIconGlyph`, so it never reaches this fallback, and the two PRs don't overlap.

## Evidence

Fixtures on an isolated dev server: `favicon-app` (has a favicon), `pixel-garden` / `blitzdiff` / `server` (no icon), `kestrel` (custom KX monogram), `rocket-lab` (🚀 emoji). The colors match desktop for the same projects.

![Desktop next to iOS and Android before and after: thread list and project picker, dark and light](https://gh-file-drop-api-prod-galwoqjslzlnws6s.oliver-boorstein.workers.dev/f/3544649e25a1de3f/comparison-all.png)

Captured on the iOS 27.0 simulator and the Android 16 emulator, with this PR's mobile files copied onto the base commit of each installed dev client. The command palette only opens from a hardware keyboard on iOS, and I didn't capture it on a device; it renders the same `ProjectFavicon`. Unit tests cover the untitled-project fallback and check color/text parity with desktop's `deriveProjectIdentity` for sample names.

Made with Claude Opus 5.5 via Claude Code in T3 Code.