Links

Links are used to embed actions or pathways to more information in a sentence or on a page.

Inline Link

---

Some content and then an inline link, followed by more content.

Link Styled as a Button

---

Callout Link Usage: Call to action links that require more emphasis. Button width increases or decreases depending on the content. Fontawesome icons can be used to enhance visual design.

Link as a button 1 Link as a button 2 Link as a button 3

Link as a Button Usage: If absolutely necessary this can be used for calls-to-action if there are good design reasons not to use Callout Link. Button width takes 85% of the parent container.

Best Practices

---

Avoid using language in links that provides no specific information or is repetitive like "read more" or "click here".

Links that start a process like downloading files, opening your e-mail client, or calling a phone number should be clearly labeled for what they do.

Last Updated: November 5, 2024