From 09da240b859e91f952fa34f7845dbd9c04493d89 Mon Sep 17 00:00:00 2001 From: Lukas Oppermann Date: Tue, 10 Dec 2024 10:51:33 +0100 Subject: [PATCH] Move adr color token name variant (#1113) * add content * fix --- .../adrs/adr-009-color-token-name-variants.md | 28 +++++++++++++------ 1 file changed, 20 insertions(+), 8 deletions(-) diff --git a/contributor-docs/adrs/adr-009-color-token-name-variants.md b/contributor-docs/adrs/adr-009-color-token-name-variants.md index e4155cf52..37b223f37 100644 --- a/contributor-docs/adrs/adr-009-color-token-name-variants.md +++ b/contributor-docs/adrs/adr-009-color-token-name-variants.md @@ -1,24 +1,36 @@ -# Title +# Color token name variants ## Status -| Stage | Status | -| -------- | ----------- | -| Approved | | -| Adopted | | +| Stage | Status | +| -------- | ------ | +| Approved | ✅ | +| Adopted | ✅ | ## Context - +As part of the new design token build process and naming convention, colors have all been moved over to the new system. Variant names have been reconciled as well to improve consistency and reduce confusion. ## Decision - +See details about the `variant` part of a token in the [ADR for color token naming](./2023-03-28-color-token-naming.md). + +We will use the following naming convention for color variants: + +- `default` - The default color variant for a given token. Example: `fgColor-default` +- `muted` - The secondary color variant for a given token. Example: `fgColor-muted` +- `emphasis` - The opposite of "muted", emphasis is a stronger color variant. Example: `bgColor-accent-emphasis` + +In this model, `muted` is used universally to mean "secondary" or "less important". Previously, we used a combination of `subtle` and `muted`. + +The term `subtle` is being deprecated and replaced with `muted` tokens. This decreases the number of variants we need to maintain and is (ideally) easier to use. ### Impact - +If we need to extend the number of variants in the future, it will be difficult to find a term to represent a third color variant. Using terms like "secondary" opens us up to the ability to add "tertiary" and so on if we need it. However, we want to keep the surface area of color variants as small as possible. ### Alternatives + +This ADR has been moved from its original place in github/primer ([view original](https://github.com/github/primer/blob/85827cee9022657301b88c3548e8dd6e3f728afa/adrs/2023-03-28-color-token-name-variants.md)).