Informative

A basic text styling classes for highlighting information progressively.

Dependencies

This layout uses the following framework items as "atoms" to create the full UI.

Uses: Components: JS:

Info

Typical styling and usage for "informative" attention grabbers. Note that this a basic view and should be used with other techniques below to make it suitable.

Information

Style Alternatives

Different styles for more subtle and general use cases.

Information

Info Button

Add a button type style to the info icon.

Add a tooltip

Add a tooltip message to the info icon.

Note: When using a tooltip always use a <a>, <button> or <input> element (as they are natively focusable).

More Information