Design system/Fundamentals
Copy for each surface
Every surface in the interface has its own sentence shape: an empty state says what's missing and what to do, an error says what happened and what now, a confirmation says what will be lost, and a toast says only what actually happened.
Empty state
- One sentence: what isn't there yet.
- If there's something to do, one button with its verb.
- A filter that found nothing gets its own sentence.
Do
“You don't have any projects yet. Create your first one.”
Don't
“No data to display.”
Error
- What happened, in the person's language.
- What to do now.
- No codes, no internal service names, no blame.
Do
“Couldn't save. Try again.”
Don't
«Error 500: Internal Server Error»
Approve
- The title is a question naming the thing that's going away.
- Body: the consequence, and whether it can be undone.
- Button: the verb of that action.
Do
“Delete this action?” and “Yes, delete”
Don't
“Are you sure?” and “Confirm”
Toast
- Short simple past: “Saved.”
- If half the work failed, say which half.
- No button; decisions belong in a dialog.
Do
“Invited, but the email wasn't sent.”
Don't
“Done successfully!” when the email wasn't sent.
Buttons and labels
- A button is a verb; a field label is a noun.
- No period at the end of buttons, labels, and headings.
- Full sentences (descriptions, errors, toasts) end with a period.
Related pages