---
title: Create a Custom Color Scheme for Shuffle Box
description: "This guide will show you how to create your own color scheme for the Shuffle Box feature in the [Tag Groups](https://publishpress.com/links/tag-groups) plugin. First, we'll introduce the default options, and then we'll see how to create your own custom themes. ---…"
url: "https://publishpress.com/knowledge-base/custom-color-scheme-shuffle-box/"
updated: "2026-10-15"
category: PublishPress Tag Groups / Shuffle Box (Pro)
---

# Create a Custom Color Scheme for Shuffle Box

This guide will show you how to create your own color scheme for the Shuffle Box feature in the [Tag Groups](https://publishpress.com/links/tag-groups) plugin. First, we'll introduce the default options, and then we'll see how to create your own custom themes.

---

## The Default Themes for Shuffle Boxes

This screenshot below shows the default design for the shuffle box.

![](https://publishpress.com/wp-content/uploads/2023/05/default-shuffle-box-1024x255.png)

You can also customize this one of [the default themes in Tag Groups](https://taxopress.com/docs/theming/). And there are additional default themes that are unique to Shuffle Boxes:

```
cm-shuffle-box-theme-default
cm-shuffle-box-theme-blue
```

---

## Custom Themes for Shuffle Boxes

- In your WordPress admin area, go to "[Tag Groups](https://publishpress.com/links/tag-groups)" then "Tag Colors".
- Enter the CSS class name. The default is "my-own-class".

![](https://publishpress.com/wp-content/uploads/2023/01/my-class-name.png)

- Choose the colors you want to use for Shuffle Box.
- Copy the CSS and add it to your theme. Add the CSS into the style.css of a child theme or you can use the Customizer.

![](https://publishpress.com/wp-content/uploads/2023/01/css-class-1024x337.png)

- Take the CSS class name from the bottom of the screen. In this example, the class is "cm-shuffle-box-theme-default my-own-class".

![](https://publishpress.com/wp-content/uploads/2023/01/css-class-name-1024x251.png)

- Go to your post and find the Gutenberg block for your shuffle box.
- Under "Advanced Styling", enter your class into the "div class" field.
- Save the post and your custom color scheme will appear.

![](https://publishpress.com/wp-content/uploads/2023/01/add-class.png)

If you're using the shortcode for Shuffle Box, add this to your shortcode: `div_class="cm-shuffle-box-theme-default my-own-class"`
