The Tabs & Accordions - by default - have a tasteful and neutral styling.

But you can customize them by using a variety of themes, as well as individually styling each tab and accordion with a dedicated color.

Individual Style

Colors

Tabs & Accordions stylesheet comes with the following colors that you can give to each tab or accordion, by using  a color="..." attribute.

Red

color="red"

You can also set the tabs or accordions to have a random color if you desire, by giving them  a color="random" attribute.

Random

My first tab

Colored Panels

By adding a color_panels="true" attribute to the first tab/accordion of a set, the content of the block will also be colored. For example:

Orange

color="orange"

Extra Class

To add an extra class to a tab or accordion (for styling purposes), you can use add a class parameter:

{tab title="My Title" class="myclass"}

Styling the Title

You can style the title of a tab/accordion - right inside the tag. So you can make it bold or another font or even place images in there.

Title with some styled text

Lorem ipsum dolor sit amet, consectetuer adipiscing elit.

Themes PRO

Tabs & Accordions Pro also come with several different themes that you can use.
The Free version only offers the Neutral and Custom themes.

You can select your Default theme in the Plugin Settings, or override it in each set of tabs/accordions by adding it to the first syntax, eg:

{tab title="My Tab Title" theme="Accent Lines"}

Here is a showcase of all the available themes:

Neutral

None

No color

Accent Lines

None

No color

Colorful

None

No color

Dark

None

No color

Light

None

No color

Lines

None

No color

Lines Colorful

None

No color

Minimal

None

No color

Pills

None

No color

Pills Colorful

None

No color

Pills Dark

None

No color

Pills Light

None

No color

Pills Minimal

None

No color

Dynamic Heights PRO

By adding a dynamic-heights="true" attribute to the first tab/accordion of a set, the active tab handle will become larger to make the distinction clearer.

Viceversa, if this feature is enabled by default in the Plugin Settings, you can disable it by adding a dynamic-heights="false" attribute to the first tab/accordion of a set.