Platform color page

[chrisglein]

Description

Adds a page to React Native Gallery (both Paper and Fabric versions) for viewing valid PlatformColor values (and example usage).

Why

1. It's hard to know what PlatformColor values you can use. The way I generally do it is through reading the Theme.cpp implementation.
2. The WinUI gallery has a lovely Colors page that is worth adapting into the React Native space (see Replicate WinUI3 Gallery's design guidance sections and rebuild in JS as appropriate #437)

What

Adds a page that provides the following:

• A simple example with sample code of doing accent color foreground/background
• A list valid PlatformColors with names and visible examples
• Those values are grouped by usage (similar to WinUI Gallery's Colors page), with a pivot to move between
• Those values are grouped by type (similar to WinUI Gallery's Colors page)
• You can see those colors over either a light or dark background

Future improvements

• Easy copy button to copy names out
• More closely match the big blocky card visual style of the WinUI Gallery's Colors page
• Track down and fix all PlatformColor values that should be working (based on the code) but aren't...

Screenshots

Note that there are different valid PlatformColor constants on Paper vs. Fabric, which is part of why I wrote this page.

Paper

Screen.Recording.2025-10-01.163727.mp4

Fabric

Screen.Recording.2025-10-01.164259.mp4

WinUI Gallery: Design: Color

For reference, here is the WinUI page that over time this should trend towards:

Screen.Recording.2025-10-01.165404.mp4

Microsoft Reviewers: Open in CodeFlow