Use profile to highlight key information to users by showing an avatar image with summary content. This highlights key information to users.
Each row of content includes a:
It's used to display key information, including:
Only use the profile component for displaying simple information. For data or complex information, consider using a table.
- Keep label as short as possible (under 2 words, like a name).
- Keep all content clear and concise.
- Display at the top of profile pages.
- Always add alt text to the image.
- Only use an image that's relevant to the summary.
- Never use a label that doesn't match the summary.
- Don't use unimportant, complex or longform content.
- Don't include punctuation.
- Never use full URLs in the label or summary.