# Grouping

**Grouping** creates interactive categorization tasks for courses. Use it to design engaging exercises that improve comprehension, help learners recognize patterns, and demonstrate how different elements connect within your subject matter.

## Style settings

<table><thead><tr><th width="230">Property</th><th>Description</th></tr></thead><tbody><tr><td><strong>Group</strong></td><td></td></tr><tr><td>Background color</td><td>Set the background color for group containers</td></tr><tr><td>Rounding</td><td>Adjust corner radius of group containers</td></tr><tr><td>Border color</td><td>Define the color for group container borders</td></tr><tr><td>Thickness</td><td>Set border thickness for group containers</td></tr><tr><td><strong>Answer</strong></td><td></td></tr><tr><td>Background color</td><td>Set the background color for answer elements</td></tr><tr><td>Rounding</td><td>Adjust corner radius of answer elements</td></tr><tr><td>Display border</td><td>Toggle border visibility around answer elements (Yes/No)</td></tr><tr><td>Border color</td><td>Define the color for answer element borders</td></tr><tr><td>Thickness</td><td>Set border thickness for answer elements</td></tr><tr><td><strong>Icon</strong></td><td></td></tr><tr><td>Answer icon upload</td><td>Upload a custom icon for answer elements</td></tr><tr><td>Icon color</td><td>Set the color for icons within answer elements</td></tr><tr><td>Background color</td><td>Define the background color for icon containers</td></tr><tr><td>Hover color</td><td>Set the color that appears when users hover over icons</td></tr><tr><td><strong>Progress bar</strong></td><td></td></tr><tr><td>Rounding</td><td>Adjust corner radius of progress indicators</td></tr><tr><td>Progress line (completed)</td><td>Set the color for completed progress portions</td></tr><tr><td>Progress line (background)</td><td>Define the color for unfilled progress portions</td></tr><tr><td>Height</td><td>Set the height of progress indicators</td></tr><tr><td><strong>Effects</strong></td><td></td></tr><tr><td>Group shadow</td><td><p>Add and configure shadow effects for group containers:</p><ol><li>Click the "+" icon to add shadow effects.</li><li>Select from shadow styles: None, Soft, Regular, or Retro.</li></ol></td></tr><tr><td>Answer shadow</td><td><p>Add and configure shadow effects for answer elements:</p><ol><li>Click the "+" icon to add shadow effects.</li><li>Select from shadow styles: None, Soft, Regular, or Retro.</li></ol></td></tr><tr><td><strong>Margins</strong></td><td></td></tr><tr><td>Card paddings</td><td>Set internal spacing for cards (top, right, bottom, left)</td></tr><tr><td>Margin from answers</td><td>Define spacing between group containers and their answer elements</td></tr><tr><td>Margin between groups</td><td>Set spacing between different group containers</td></tr></tbody></table>

## Typography settings

Customize Grouping appearance using rich-text formatting options. These changes apply only to the Answer and Result within the Grouping element and do not affect other text elements.

You can modify the following properties:

* Font
* Style
* Size
* Line spacing
* Color

For details on how to configure parameters in rich-text options, see [Typography and fonts](/branding/create-branding/typography-and-fonts.md).


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://help.parta.io/branding/create-branding/elements/grouping.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.