Metro Tabs
Metro Tabs add a splash of multi color to a web page and can be used to create a more dramatic effect than the usual style.
Tabs are added as needed - up to a maximum of eight - and named as required. Each tab has a selector menu to choose its background color. This background color is inherited by the associated tab content.
Content
Content blocks have options for an image with alt text, a heading, a text block and a CTA style link. The link can be configured to open internal or external pages and have a new window option.
NOTE: Each content block MUST be assigned a number which corresponds with the associated tab.
Flex Tab Layout
The tabs have a flex layout to keep the rows filled when viewed on narrower screens. If viewing this page on a computer, reduce the browser width to how this works.
Wrapper
The overall wrap has controls for background color and its opacity and there is a control for spacing the item vertically from those above and below it.
Alternatives
The Tabs widget can be used for a more restrained and conventional look and the Switch Tabs can have a contrasting current tab color and switch to an accordion layout on mobile phones.