microsoft / microsoft/vscode

Validate Medium and Small shadow tiers for Modern UI

Open
#332,679 0 comments 0 reactions 1 assignee Claimed by @mrleemurray View on GitHub
modernization
Dominant language
TypeScript
Stars
193k
Forks
42.4k
PR merge metrics
PR metrics pending

Description

## Description

The Figma elevation documentation currently includes only Large and XLarge shadows.

In the product, Modern UI also defines Small and Medium shadow tokens:

- Small: `--vscode-shadow-sm`
- Medium: `--vscode-shadow-md`

However, they behave differently:

- Small is explicitly made transparent when Modern UI is enabled, so it has no visible Modern UI use case.
- Medium remains active and appears on surfaces such as the editor minimap edge, Extension item hover, Chat Editing overlays, and inline diff controls.

## Validation needed

Please confirm whether **Medium shadow** is an intentional part of the Modern UI elevation system.

If Medium is valid:

- Define its intended semantic role and usage boundaries.
- I will add Medium shadow to the Figma documentation.

If Medium is not valid:

- Identify whether its product uses should move to Large, use a border, or remove elevation.

Please also confirm that **Small shadow is intentionally unsupported in Modern UI** and does not need to be documented in Figma.

## Acceptance criteria

- A decision is documented on whether Medium is a supported Modern UI shadow tier.
- If approved, Medium’s intended usage is defined for the Figma documentation.
- If rejected, existing Medium product uses are identified for alignment.
- Small is confirmed as either intentionally excluded or requiring further alignment.
- The product and Figma elevation systems use the same supported tiers.

Currently in product
Image

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.