Admin- and Mastermark
The admin- and master mark is a visual pattern used to signal that a setting or function is not available to organizers, but reserved for internal use by developers or Reservix employees. It provides a clear boundary between organizer-facing features and internal tools, helping designers and developers avoid accidental exposure of internal controls in user interfaces.
Anatomy
The admin- and master mark uses color and labeling to indicate internal access. It appears either as a badge placed near the related element or section of a page, or through direct coloring of the element itself.
The badge contains the text "Admin" or "Master", depending on the role. To ensure quick visual differentiation, "Admin" is represented in orange and "Master" in purple. This consistent use of color helps communicate access levels clearly and supports scannability in shared interfaces.
Usage
The admin- and master mark is used to indicate that certain features in the user interface are not intended and visible for end users. In shared views where both internal users and end users operate, this pattern helps prevent confusion and highlights which elements are meant for internal use only.
- The "Admin" mark is applied to elements intended for developers. This includes technical tools such as environment toggles, debug options, or features still under development.
- The "Master" mark is used for features that are available to Reservix employees, such as internal workflows, support-only settings, or tools used by account management teams.
Apply the admin- and master mark in situations where internal-only functionality appears in shared views. Typical scenarios include:
- Controls in user interfaces visible to external users.
- Developer-specific configuration options that are not part of the public feature set.
- Features that are technically in production but intentionally hidden from or not relevant to external users.
- Functionality that is still under development, can only be partially enabled, or currently in a testing or staging phase.
This pattern is not a substitute for proper role-based access control. It should not be used to control visibility or enforce permissions. It also does not need to be applied in fully internal tools where organizers do not have access at all since in those cases, there is no risk of confusion and no need for additional visual marking.
Placement
The admin- and master mark should be placed directly to the right of the label or heading of the section or element it applies to. This ensures the access distinction is immediately visible and clearly associated with the relevant control.
Use the <Badge>
component with the "master" or "admin" variant to place the mark next to the label in form fields or input groups. This ensures that users understand the access level before interacting with the field. Placing it beside the label ensures a clean layout and avoids any confusion about its relation to the field content.
In navigation elements such as tabs or grouped settings, place the mark next to the tab label or section heading. This makes it clear that the entire area is intended for internal use.
Avoid placing the mark at a distance from the related element. Doing so reduces clarity and can lead to incorrect assumptions about access. The mark is a functional visual indicator and should be treated with the same attention as labels or status cues.
Within a Table
In tables, the admin- and master mark is not applied as a badge. Instead, internal-only rows are visually distinguished through background color and a subtle inline indicator. To apply the color use the "master" or "admin" variant on the <Table.Row>
component.
This exception is intentional. Since badges can clutter dense tabular layouts, a more lightweight visual cue is used to signal internal visibility. A soft background tint helps set these rows apart without disrupting the structure of the table. An inline label or icon may be used when additional clarity is needed.
Use this approach when:
- A table contains a mix of internal and external data
- Some rows are only relevant to internal users (e.g. test entries, system-generated records, flagged data)
- You want to preserve alignment and readability without adding badges to every row
Event Name | Date | Status |
---|---|---|
Spring Gala | April 15, 2025 | Confirmed |
Jazz Night | May 2, 2025 | Sold Out |
System Test Entry | – | Internal |
Open Air Theater | June 10, 2025 | On Sale |
Flagged: Duplicate Listing | - | Review Needed |