Panels

A panel is a simple, helpful component that enables you to outline sections of your page easily. This allows you to view your page sections as you add content to them or add emphasis to a section. The width is controlled by the grid columns you put them inside.

Basic

This is a .panel

With four versatile performers – PLAYBAR, SUB, and a pair of rear speakers – you’ve got immersive 5.1 sound. And with it? The power to play anything and make it sound amazing.

This is a .panel with a .panel-header

With four versatile performers – PLAYBAR, SUB, and a pair of rear speakers – you’ve got immersive 5.1 sound. And with it? The power to play anything and make it sound amazing.

Two-tone Variation

We're showing a couple versions of the two-tone panel. You can use brand classes to control the panel header, the panel, and the content inside the panels to completely customize your content.

This is a .two-tone.white.panel.

With four versatile performers – PLAYBAR, SUB, and a pair of rear speakers – you’ve got immersive 5.1 sound. And with it? The power to play anything and make it sound amazing.

This is a .two-tone.dark.panel.

With four versatile performers – PLAYBAR, SUB, and a pair of rear speakers – you’ve got immersive 5.1 sound. And with it? The power to play anything and make it sound amazing.

Further Customization

Panels can be customized further by adding brand classes to children elements.

This is a custom two-tone panel.

With four versatile performers – PLAYBAR, SUB, and a pair of rear speakers – you’ve got immersive 5.1 sound. And with it? The power to play anything and make it sound amazing.