Success state
Also called: confirmation screen, success message, thank-you screen, done state.
What the screen shows after something worked, like a sent form or a finished payment. It says clearly what happened and what you can do next.
After you send the form, the same space shows a success state: a check mark, what happened, and what to do next.
Form
Say it in a prompt
After the form is sent, replace it in the same card with a success state: a 52px accent circle with a white check that pops in (scale from 50% with a small overshoot), the headline "You're subscribed!", one line saying where the email went, and a "Back to the site" link. Where it shows up
- After you pay for an order or sign up for a newsletter, the form is replaced by a big check mark and "Thank you" with the next step.
You might describe it as
- big green check after I send the form
- thank you screen after paying
- message that says it worked with a check mark
Not to be confused with
- Toast
A success state takes over the place where the form was; a toast is a small note in the corner that goes away by itself.