UI copy template

Error message copy templates

An error message appears at the worst moment in a session, so it has to be readable at a glance and specific enough to act on. The useful shape is consistent: what failed, the reason if you know it, and the recovery. Errors are also the strings most likely to arrive from a backend at unpredictable lengths, which is why an inline error slot designed around "Required" tends to break the first time it receives a real sentence.

Open in TypeMatch

Loads the preset below in this page. It never runs on its own and never touches text you have already typed.

Copy that works, and copy that does not

Works

  • We could not save your changes because the connection dropped. Try again.

    Cause and recovery in one sentence, no blame.

  • That email address is already registered. Sign in instead, or use a different address.

    Explains the conflict and offers both realistic paths.

  • File is larger than 10 MB. Choose a smaller file or compress this one.

    States the exact limit that was exceeded.

Falls short

  • Error 0x8007007E

    A code with no human meaning and no action.

  • Something went wrong.

    Technically true, entirely unactionable, and it hides whether a retry will help.

  • You entered an invalid value.

    Blames the user and never says which rule was broken.

Length to design for

Suggested copy lengths for error messages
ElementSuggested rangeWhy
Inline field error2–8 words, under 60 charactersFits under an input without pushing the next field off a mobile screen.
Toast or banner error1 sentence, 60–120 charactersReadable in the few seconds a toast is visible.
Full-page errorheading plus 1–2 sentencesThere is room for a reason and a link to support.
Retry action1–2 wordsKeeps the recovery button unambiguous next to the message.

These ranges are starting points drawn from common component widths, not rules. Measure against your own type scale and breakpoints before locking a constraint.

Accessibility considerations

  • Associate inline errors with their input using aria-describedby and set aria-invalid on the field so assistive tech announces the problem when focus lands.
  • Put form-level errors in a container with role="alert" or an aria-live region so they are announced when they appear.
  • Never signal an error with red alone. Include an icon or the word describing the failure.
  • Move focus to the first invalid field on submit rather than to the top of the page, so keyboard users can correct without hunting.

Try this preset in TypeMatch

Loaded with a set of inline and banner error strings so you can test how longer wording behaves in the slot you designed.

Your text

Up to 20,000 characters per run. Emoji, accented characters and multiple paragraphs are all supported.

How your text is handled: matching runs in this browser tab, so the text you paste here is not sent to a TypeMatch server and is not saved between visits — closing or reloading the tab clears it. Usage analytics record only counts and settings, never your text. Anything you copy out is then handled by your own clipboard and the app you paste into.

Detected in your text

Words
19
Chars
113
No spaces
93
Paragraphs
3
Length constraint

Auto-detected from your text (113 chars). Unlock to set your own.

or press ⌘/Ctrl Enter
Refine result
Match method

Recent on this device

Your last 10 runs will be listed here, saved in this browser's local storage only. Nothing is uploaded and you can clear it at any time.

Saved presets

Save the current content type, tone, constraint mode and structure settings so your next run starts configured. Presets stay in this browser.

Generated copy

Waiting for your text

Variants

Paste your text and press “Match my copy” — you’ll get three verified variants to compare.

Words
0/ 19
Chars
0/ 113
No spaces
0/ 93
Paragraphs
0/ 3
Matching runs in this browser tab
Refine

Refinements keep your exact characters (with spaces) target of 113 unchanged.