Back to library

System

Success State Button

A state transition that keeps completion feedback inside the original button.

successsaveconfirm

Usage

Use this interaction when the action benefits from immediate tactile feedback without taking visual attention away from the surrounding interface.

Platform: Mobile / Web

Motion parameters

Interaction
Save and completion feedback
Hover
Static primary surface
Press
Scale 0.96
Spring
standard Motion press
Duration
1500ms success hold
Easing
easeOut

Code

tsx
<SuccessStateButton />

Production API and token extraction will be added in a later package pass.