UI Copy & Components
Many elements in the UI have specific rules around capitalization, how lengthy text should be, and whether complete sentences are used. What follows are rules for our most common UI components.
Usage
| Element / Component | Case | Notes |
|---|---|---|
| Button Labels | Title Case | |
| CardCreate | Title Case | Create [Name] |
| Content inside a MessageBar, MessageBox, Modal, Popover, or QuickHelp | Sentence Case | Complete sentences with punctuation. |
| Field Labels (Long) – For long checkbox and radio buttons | Sentence Case | Phrases only (if possible). No period at the end. |
| Field Labels (Normal) – Excludes long checkbox and radio buttons | Title Case | |
| Link Labels | Title Case | |
| MessageBar and MessageBar Expandable | Sentence or Title Case | If just a short message, use sentence case. If presenting a list (such as alerts), use Title Case. |
| MessageBox Titles | Sentence Case | Phrases only. No period at the end. |
| Modal Sub-Titles | Sentence Case | |
| Modal Titles | Title Case | Phrases only. |
| Page Names | Title Case | |
| Panel Headings | Title Case | |
| Popover Titles | Title Case | Phrases only. |
| QuickHelp Titles | Title Case | May use a phrase or sentence. Content should be short and not contain formatting. Consider using a Popover if you need more. |
| Section Names | Title Case | |
| Tab Names | Title Case | |
| Toast | Sentence Case | Short phrases only. Typical format is subject + verb. |
| Tooltip Content | Sentence Case | Short phrases only. No sentences. No period at the end. |
Links
Links and buttons are used to trigger actions. Links are typically used to navigate users to another location while buttons are an "on page" action. Links should be specific and clearly communicate to the user where they will go or what will open.
If a sentence or phrase contains only one link, use the verb in the link itself. For example: View Support Documentation
If it contains multiple links, each link should be separate. For example: View Expense Documentation, Travel Documentation, or Invoice Documentation.