element-hq / element-hq/compound

Design Tokens: Add a new set of alpha tokens

Open
#241 0 comments 0 reactions 1 assignee Claimed by @janogarcia View on GitHub
T-Component-Design
Dominant language
MDX
Stars
24
Forks
7
PR merge metrics
No merged PRs in 30d

Description

# Context

The list of new alpha tokens to be formalized is still in the works.

We're normalizing recent contributions to Element Web and Element Call components on Figma.

As part of this process, we're facing some new uses for alpha tokens for which we lack either a semantic token, a base token, or even a potentially new type of tokens (static tokens, which don't change when switch between light and dark modes).

(WIP) Non-exhaustive or final list:

- An alpha version for the `color.bg.action.primary.rest` semantic token, which could be named `color.bg.action.primary.rest-alpha`.
- A dynamic (reacts to switching light/dark mode) alpha canvas token, that is set to the canvas color @ 94% opacity (minimum accessible opacity when rendered against `#000` in Light theme and `fff` in Dark theme and setting the icons and text in the foreground to secondary `color.gray.900`).
- Scrim (used as the backdrop for modals or other overlays)
- Scrim gradient (subtle cutoff for scrollable areas, subtle overlay for elevated layers).
- And more.

# Platform

All.

```[tasklist]
# Design phase
- [ ] Tokens are added to Tokens Studio
- [ ] Tokens are published to Compound Styles Figma library
- [ ] Tokens are made available to Themer if necessary
- [ ] Tokens shareout for designers
```

```[tasklist]
# Development phase
- [ ] Tokens are generated for the target platforms
```

Contributor guide

No contributing guide indexed for this repository

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.