Admin Materials and Surfaces
As we further develop the primitives that make up the overall admin system (#53322) it seems important to map out the main elements that compose it. This issue focuses largely on how things might work and how things are structured, not how they look. We'll start, for the sake of the presentation, with defining **Materials**, **Concepts**, and **Screens**. Materials are the places where Concepts are rendered; Concepts are the interfaces for the various items a site needs to represent; and Screens are the dedicated routes that bring them all together and construct the various user flows. The terminology is just an instrument to help us break things down. The main thing to capture here is that the admin is composed out of a few shared pieces to account for the needs of extensibility, personalization, flexibility, and consistency. --- ## The Materials The overall Admin user interface is composed of a few core materials, grouped into **Base**, **Surfaces**, and **Overlays**. ### Base This is the base layer of the interface. It can change colors between light, dark, or user defined color palettes. The base layer contains the following items: <img width="1492" height="940" alt="Image" src="https://github.com/user-attachments/assets/92cbc845-7e39-4f05-8711-29b0f9e6dc9f" /> ### Surfaces We define three main element that build up the various layouts of the admin screens. - **Canvas** The primary area for previewing and editing content (e.g., block editors). - **Stage** Harbo
Posted by mtias on Jul 25, 2025, 5:02 PM
Tags
Related issues
- [BUG] Cowork (Windows): all Plan9 shares fail with "Plan9 mount failed: invalid argument" after Windows update KB5124008 (26200.9445) — uninstalling the KB fixe
- Feature Request: Auto-resume CLI session when usage limit resets
- Please deobfuscate the Python
- [Bug] MLX version of Gemma 4 26B fails to load: "Model type gemma4 not supported" (macOS)
- # 233 Developers Discussed Abandoning the Office Add-in Platform — An Open Letter on the Office.js Stability, Security & Trust Crisis
- [FEATURE] Allow users to configure which shell the Bash tool uses or inherit initial shell
Raise real-world problems, find people facing the same issue, and discuss solutions.2,000 issues0 comments
reliability (Software)
[BUG] Cowork (Windows): all Plan9 shares fail with "Plan9 mount failed: invalid argument" after Windows update KB5124008 (26200.9445) — uninstalling the KB fixe
Feature Request: Auto-resume CLI session when usage limit resets
Please deobfuscate the Python
[Bug] MLX version of Gemma 4 26B fails to load: "Model type gemma4 not supported" (macOS)
# 233 Developers Discussed Abandoning the Office Add-in Platform — An Open Letter on the Office.js Stability, Security & Trust Crisis
[FEATURE] Allow users to configure which shell the Bash tool uses or inherit initial shell
Admin Materials and Surfaces
AMD Support
Admin Materials and Surfaces
As we further develop the primitives that make up the overall admin system (#53322) it seems important to map out the main elements that compose it. This issue focuses largely on how things might work and how things are structured, not how they look. We'll start, for the sake of the presentation, with defining **Materials**, **Concepts**, and **Screens**. Materials are the places where Concepts are rendered; Concepts are the interfaces for the various items a site needs to represent; and Screens are the dedicated routes that bring them all together and construct the various user flows. The terminology is just an instrument to help us break things down. The main thing to capture here is that the admin is composed out of a few shared pieces to account for the needs of extensibility, personalization, flexibility, and consistency. --- ## The Materials The overall Admin user interface is composed of a few core materials, grouped into **Base**, **Surfaces**, and **Overlays**. ### Base This is the base layer of the interface. It can change colors between light, dark, or user defined color palettes. The base layer contains the following items: <img width="1492" height="940" alt="Image" src="https://github.com/user-attachments/assets/92cbc845-7e39-4f05-8711-29b0f9e6dc9f" /> ### Surfaces We define three main element that build up the various layouts of the admin screens. - **Canvas** The primary area for previewing and editing content (e.g., block editors). - **Stage** Harbo
Comments (0)
No comments yet. Start the discussion.