Text Formatting

Date and Time

Standard format:

MMM, DD, YYYY, HH:MM AM/PM

  • Timezones should be in parentheses after the label name

Timestamps with label

Timestamps with no label

Timestamps in a Table


Time Duration

UnitAbbreviation
millisecondms
secondsec, secs
minutemin, mins
hourhr, hrs
dayday, days
One unit of timeTwo units of time3+ units of time
1 day4 hr 24 min00:00:00 [HH:MM:SS]
2 days3 min 19 sec 

Amounts

UnitAbbreviationExample
thousandNone (default)
K (if space is limited)
12,000
12K (12,000)
millionM1.2M (1,200,000)
billionB2.4B (2,400,000,000)

Numbers and Decimals

 
Use numerals instead of writing out numbers0 errors
3 errors
Zero errors
three errors
Use max 2 decimal places when applicable, else use whole42%
42.08%
42.30310%

Ellipses (…)

Use ellipses for truncated text. Depending on the context, decide between beginning, middle, or end truncation

This is a really long long…This is a really long…long name…This is a really long long name

Use ellipses in the Upload button.

Use ellipses when something is in progress

Don’t use ellipses for menu options


Labels, Tooltips, and Required Fields

Labels are represented in gray without a colon to reduce visual noise.

Always represent required fields with a red asterisk after the label name and colon

Tooltips should follow the required asterisk.


Placeholder Text

Try to limit the amount of placeholder text you use for input fields.
Always have placeholder text for search and combobox fields.

  • Form Field
  • Empty
  • Instructional









  • Formatting
  • Example
  • Read-Only
  • No Value

Make links as descriptive as possible

✅ Good
❌ Bad

Never use the word here as the link

❌ Bad

Opt for inline links

✅ Good

Use learn more links if there are multiple reasons for a state

✅ Good