Web Components

The common web components below may be used to create a consistent look and feel across your websites.

View Collection on CodePen

Buttons

View the styles available for the appearance of buttons on CodePen.

See the Pen Button Collection by TAMU MarComm (@tamumarcomm) on CodePen.


Text Design Elements

From quotes to captions and headings, there are several formatted text elements. View library on CodePen.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque volutpat ultrices ipsum vitae tincidunt. Vivamus eget magna aliquam, laoreet dolor sit amet, scelerisque sem.

"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque volutpat ultrices ipsum vitae tincidunt. Vivamus eget magna aliquam, laoreet dolor sit amet, scelerisque sem."

— Lorem Ipsum Dolor

"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque volutpat ultrices ipsum vitae tincidunt. Vivamus eget magna aliquam, laoreet dolor sit amet, scelerisque sem."

— Lorem Ipsum Dolor

The yellow bar design element can be used to highlight or draw attention to information. View captions on CodePen.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent pellentesque vehicula dui, vel sollicitudin felis pretium et. Proin rutrum nibh tellus, non consequat velit venenatis vitae. Duis lacinia purus quis mattis porta.

Image caption example

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent pellentesque vehicula dui, vel sollicitudin felis pretium et. Proin rutrum nibh tellus, non consequat velit venenatis vitae. Duis lacinia purus quis mattis porta.

This red line is a subtle way to feature a headline, and can be used before and after or as an underline to headings. View headings on CodePen.

Heading Style 1

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent pellentesque vehicula dui, vel sollicitudin felis pretium et. Proin rutrum nibh tellus, non consequat velit venenatis vitae. Duis lacinia purus quis mattis porta. Donec dolor orci, dictum eget pretium sed, vehicula eget dui. Morbi justo libero, ullamcorper nec dapibus et, euismod at dolor. Maecenas id nisl urna. Cras et vehicula nisi. Fusce est tellus, molestie in hendrerit sit amet, tincidunt sit amet eros. Aliquam et turpis sed nisl pellentesque porttitor. Quisque varius placerat nulla, at dapibus eros mollis vitae. Nam arcu turpis, hendrerit vitae nibh ut, rhoncus hendrerit ipsum.