NSU Button Styles

Styles and Examples

All of the button styles come in four different variants:  The button style names are indicated in parenthesis after the button style names.

NSU Green Button (Default) & Button (Green-White)

This style will display links as a green button with white text changes to green text white background. This button style is useful as primary action buttons, note content of higher importance, or to simply draw attention to something. When hovered over, the button's background color changes to a slighlty darker green.

Button (Default) & Button (Green-White)

Button (White-Green)

This style will display links as a white button with black text changes to white text green background.

Button (White-Green)

NSU Green Button

This style will display links as a green button with white text. This button style is useful as side navigation action buttons. When hovered over, the button's background color changes to a slighlty darker green.

Button (Block Style)

NSU Transparent to White Button (Alternative Style)

This style will display links as a clear button with white text and border. This button style is usually used to indicate something of normal importance, or lesser importance than something using the NSU transparent to white style. When hovered over, the button's background color changes to a white color, and the text color becomes green.

Button (Alternative Style)

NSU Green Outline Button (More Link Style)

This style will display links as a white button with NSU Green text and border, similar to the Transparent Button style. When hovered over, the button's text color changes to a NSU green color, becomes black.

Button (More Link Style)