Buttons & Links


Buttons and links empower users to navigate and engage with the website. Employ each element purposefully, ensuring they serve distinct functions for a seamless and intuitive user experience.

Primary Buttons

Primary buttons strategically to capture visitor attention and highlight key actions. To maintain their effectiveness, refrain from excessive use. Avoid placing two primary buttons side by side to ensure clarity and prevent confusion in user interactions.



<button type="button" class="btn btn-primary btn-lg">Call to Action</button>

Secondary Buttons

Secondary buttons strategically to capture visitor attention and highlight key actions when visiting project pages.


<button type="button" class="btn btn-primary btn-lg">Call to Action</button>

Secondary Link

In scenarios where an action holds moderate significance or when multiple actions are closely positioned, it is recommended to use a secondary text link. Secondary links, accompanied by a right arrow, serves as a visual cue, offering a nuanced yet effective way to distinguish and guide users through these specific interactions within the interface.

Call to Action


<p><a class="sec-link">Call to Action <i class="fa-solid fa-arrow-right"></i></a></p>



Accessibility

Buttons and links are designed with accessibility in mind. They include descriptive text and ARIA attributes for screen readers. Clear focus states enhance keyboard navigation, and color contrasts adhere to WCAG standards.