Berkeley Brand Widget Examples

Jump to widget descriptions and examples:

• Promo Block
• Promo with Image
• Quote
• Thumbnails

Promo Blocks have either a color background (Berkeley Blue, Blue Medium, Green Dark, Green Medium, Purple Dark, Purple Medium, Rose Dark) with white text, or a white background with black text. Promo Blocks may be linked to site and external content. 

Promo block examples

Promo with Image widgets feature a photo with a section below it with either a color background (Berkeley Blue, Blue Medium, Green Dark, Green Medium, Purple Dark, Purple Medium, Rose Dark) with white text, or a white background with black text. Promo with Image widgets may be linked to site and external content.

Promo with image examples

Quote widgets have either a color background (Berkeley Blue, Blue Medium, Green Dark, Green Medium, Purple Dark, Purple Medium, Rose Dark) with white text, or a white background with color text. 

Quote widget examples (color and white backgrounds)

Photo Thumbnails, Photo Thumbnail with Modal, and Video Thumbnail with Modal widgets feature a photo with a band of color (Berkeley Blue, California Gold, Rose Dark, Purple Dark, Green Dark, Gold Dark, Blue Medium, Rose Medium, Purple Medium, Green Medium) at the bottom with title text. Photo Thumbnails are meant to be linked to internal or external content, and Photo Thumbnail with Modal and Video Thumbnail with Modal widgets are meant to feature a photo or video that is opened in a separate modal window. The Thumbnail List widget has a photo and a line of heading text in black along with an optional secondary text option. Multiple items can be added to one Thumbnail List widget and will display in a single column.

Photo Thumbnail examples

Photo Thumbnail with Modal examples

Video Thumbnail with Modal examples

Thumbnail List example