Shadow, focus, and layering tokens keep Nerio surfaces precise without tying the system to decorative depth or a specific product category.
Elevation scale
Tokenized
Name
Token
Use
None
--n-shadow-none
Flat surfaces and controls that do not need elevation.
Extra subtle
--n-shadow-xs
The lightest available depth primitive.
Raised
--n-shadow-sm
Restrained separation for raised containers.
Floating
--n-shadow-md
Overlays, dialogs, toasts, and floating controls.
Semantic effects
Name
Token
Use
Flat surface
--n-shadow-surface-flat
Resolves to no shadow by default.
Control surface
--n-shadow-surface-control
Keeps default controls shadow-free.
Raised surface
--n-shadow-surface-raised
Resolves to the restrained raised shadow.
Floating surface
--n-shadow-surface-floating
Resolves to the strongest Core elevation.
Focus ring
--n-focus-ring
Two-stage visible keyboard focus treatment.
Overlay layer
--n-overlay-z-index
Portal stacking contract for menus, popovers, dialogs, and toasts.
Focus
--n-focus-ring combines a 2px surface-colored offset with a 4px soft outer ring. Theme and mode selectors remap the ring colors while controls share the same focus geometry.
