ElevationToken
A token variant with a layers icon for documenting elevation and shadow values.
Overview
ElevationToken is a specialized variant of the Token component that adds a visual icon to help distinguish elevation and shadow values while keeping the same tooltip interaction for inspecting values.
This component implements the shadow composite type from the W3C Design Tokens specification (§9.6), which represents shadow styles with color, offsets, blur, and spread properties.
Installation
npx shadcn add @tokenui/elevation-token
Usage
Use ElevationToken for shadow or depth values:
Want your own variant?
Check the source for this component and the bundled BaseIconToken to mirror the Token → TokenName → TokenIndicator pattern when you create your own icon-based token components.
API Reference
ElevationToken
Prop
Type