The "Text" component is a fundamental feature of our site, providing a WYSIWYG (What You See Is What You Get) editor that allows users to easily write and format text. It is the most commonly used component, designed for straightforward text input. The component is perfect for delivering information in a clean and readable format, ensuring that the focus remains on the message being conveyed.
Live Example
University of Utah Health is an economic engine unlike any other in Utah. With more than 14,000 faculty and staff it is one of the state's largest employers and contributes millions of dollars in net tax revenue to Utah every year. But University of Utah Health's impact goes beyond the balance sheet. Its bottom line includes the health and well being of Utah residents in every corner of the state and from all walks of life.
University of Utah Health is the only university health care system in the state of Utah and provides patient care for the people of Utah, Idaho, Wyoming, Montana, and much of Nevada. It is also the training ground for most of Utah's physicians, nurses, pharmacists, therapists, other health care professionals, and for the next-generation of researchers and scientists.
Options and Variations
Text Margin Options
Padding can be added to the top and bottom of the text block to separate the content that is displayed before and after the text block component.
Text can be bold.
Text can be italic.
Text can be underlined.
Text can be made into a bulleted list:
- List item one.
- List item two.
- List item three.
Text can be made into a numbered list:
- List item one.
- List item two.
- List item three.
Top and Bottom Margin
The text component is an incredibly flexible and offers many ways to format your written content. The WYSIWYG editor easily allows the user to customize their text in real time. See examples below for some of the possible formatting options:
Top Margins
There is no bottom margin applied to this text block component. Donec tincidunt dapibus purus id dignissim. Aliquam neque ex, interdum ut suscipit sit amet, pellentesque eget ex.
Sed vel pulvinar lacus. Nulla venenatis odio in leo lobortis congue. Donec at tellus fermentum, mollis eros vitae, commodo massa. Nunc vel massa non nisl rhoncus luctus. Aenean ac commodo libero.
There is an extra small margin applied to this text block component. Donec tincidunt dapibus purus id dignissim. Aliquam neque ex, interdum ut suscipit sit amet, pellentesque eget ex.
Sed vel pulvinar lacus. Nulla venenatis odio in leo lobortis congue. Donec at tellus fermentum, mollis eros vitae, commodo massa. Nunc vel massa non nisl rhoncus luctus. Aenean ac commodo libero.
There is a small margin applied to this text block component. Donec tincidunt dapibus purus id dignissim. Aliquam neque ex, interdum ut suscipit sit amet, pellentesque eget ex.
Sed vel pulvinar lacus. Nulla venenatis odio in leo lobortis congue. Donec at tellus fermentum, mollis eros vitae, commodo massa. Nunc vel massa non nisl rhoncus luctus. Aenean ac commodo libero.
There is an medium margin applied to this text block component. Donec tincidunt dapibus purus id dignissim. Aliquam neque ex, interdum ut suscipit sit amet, pellentesque eget ex.
Sed vel pulvinar lacus. Nulla venenatis odio in leo lobortis congue. Donec at tellus fermentum, mollis eros vitae, commodo massa. Nunc vel massa non nisl rhoncus luctus. Aenean ac commodo libero.
There is a large margin applied to this text block component. Donec tincidunt dapibus purus id dignissim. Aliquam neque ex, interdum ut suscipit sit amet, pellentesque eget ex.
Sed vel pulvinar lacus. Nulla venenatis odio in leo lobortis congue. Donec at tellus fermentum, mollis eros vitae, commodo massa. Nunc vel massa non nisl rhoncus luctus. Aenean ac commodo libero.
There is a extra large margin applied to this text block component. Donec tincidunt dapibus purus id dignissim. Aliquam neque ex, interdum ut suscipit sit amet, pellentesque eget ex.
Sed vel pulvinar lacus. Nulla venenatis odio in leo lobortis congue. Donec at tellus fermentum, mollis eros vitae, commodo massa. Nunc vel massa non nisl rhoncus luctus. Aenean ac commodo libero.
Bottom Margins
Sed vel pulvinar lacus. Nulla venenatis odio in leo lobortis congue. Donec at tellus fermentum, mollis eros vitae, commodo massa. Nunc vel massa non nisl rhoncus luctus. Aenean ac commodo libero.
There is no top margin applied to this text block component. Donec tincidunt dapibus purus id dignissim. Aliquam neque ex, interdum ut suscipit sit amet, pellentesque eget ex.
Sed vel pulvinar lacus. Nulla venenatis odio in leo lobortis congue. Donec at tellus fermentum, mollis eros vitae, commodo massa. Nunc vel massa non nisl rhoncus luctus. Aenean ac commodo libero.
There is an extra small top margin applied to this text block component. Donec tincidunt dapibus purus id dignissim. Aliquam neque ex, interdum ut suscipit sit amet, pellentesque eget ex.
Sed vel pulvinar lacus. Nulla venenatis odio in leo lobortis congue. Donec at tellus fermentum, mollis eros vitae, commodo massa. Nunc vel massa non nisl rhoncus luctus. Aenean ac commodo libero.
There is a small top margin applied to this text block component. Donec tincidunt dapibus purus id dignissim. Aliquam neque ex, interdum ut suscipit sit amet, pellentesque eget ex.
Sed vel pulvinar lacus. Nulla venenatis odio in leo lobortis congue. Donec at tellus fermentum, mollis eros vitae, commodo massa. Nunc vel massa non nisl rhoncus luctus. Aenean ac commodo libero.
There is a medium top margin applied to this text block component. Donec tincidunt dapibus purus id dignissim. Aliquam neque ex, interdum ut suscipit sit amet, pellentesque eget ex.
Sed vel pulvinar lacus. Nulla venenatis odio in leo lobortis congue. Donec at tellus fermentum, mollis eros vitae, commodo massa. Nunc vel massa non nisl rhoncus luctus. Aenean ac commodo libero.
There is a large top margin applied to this text block component. Donec tincidunt dapibus purus id dignissim. Aliquam neque ex, interdum ut suscipit sit amet, pellentesque eget ex.
Sed vel pulvinar lacus. Nulla venenatis odio in leo lobortis congue. Donec at tellus fermentum, mollis eros vitae, commodo massa. Nunc vel massa non nisl rhoncus luctus. Aenean ac commodo libero.
There is an extra large top margin applied to this text block component. Donec tincidunt dapibus purus id dignissim. Aliquam neque ex, interdum ut suscipit sit amet, pellentesque eget ex.
Usage
Do...
- Write clear and concise content to effectively convey your message.
- Use paragraphs to break up text and make it more readable.
- Use bullet points or numbered lists for easy-to-read key points.
- Proofread your text for spelling and grammar errors before publishing.
- Keep your audience in mind and write in a style that is easy to understand.
- Use hyperlinks to provide additional information or references.
Don't...
- Use overly long paragraphs; break them up for better readability.
- Using excessive jargon or technical terms that your audience might not understand.
- Use all caps, as it can be hard to read and may seem like shouting.Use inconsistent font styles or sizes; maintain a uniform appearance.
- Overcrowd the text with too many links or references.
- Wrtite in a way that is too formal or too casual; match the tone to your audience.