Do you know how to format UI elements in technical documentation?
When writing technical instructions, it's important to distinguish UI controls, buttons, and labels from regular text to improve readability and maintain consistency.
Click Save to store your changes.
Figure: Bad Example - It's not clear that Save is a control
Option 1: Bold
Best for UI elements like buttons, labels, or menu options.
Tip: See how to add bold in Markdown.
Click Save to store your changes.
Figure: Good example - Using bold for buttons and menu options
Option 2: Quotation marks
Useful for texts users must enter.
Type "Admin" in the Username field.
Figure: Good example - Using quotation marks for exact text users may type
Option 3: Code formatting
Ideal for commands, or file names.
Tip: See how to use code formatting in Markdown.
Enter the command git clone https://github.com/user/repo.git
Figure: Good example - Using quotation marks for exact text users may type
