Widget Title Bar

PORTAL

A bar that contains the widget's title and the tools that affect the widget.

Definition and Metrics

The Widget title bar pattern can be defined in different ways, depending on the needs of the application.

Widget Title Bar Definition And Metrics

This bar is always placed at the top of the widget box.

Widget Title Bar Definition And Metrics

The box's title may grow in length, in which case the title must adjust to the size of the widget:

Widget Title Bar Title Behavior

Widget Title Bar Long Title Behavior

Variations

The widget title bar can have multiple variations, depending on what editing options the user may access:

Widget Title Bar Variations

Examples in Context

Blogs examples with different widget title bar configurations:

Widget Title Bar example 1 in blogs

Widget Title Bar example 2 in blogs

Comments examples with different widget title bar configurations:

Widget Title Bar example 3 in comments

Menu