---
url: "https://vueda.dev/v3/reference/theming/keys/FieldGroup.md"
title: "FieldGroup"
---

# FieldGroup

Source: `client/lib/theme/vueda-tailwind/shell/index.js`

> The stack for related fields and nested field groups. It establishes the field-group container query used by responsive fields and tightens spacing for checkbox and radio groups.

Vue component: [FieldGroup](/v3/reference/api/vue/FieldGroup.md)

| Slot | Default classes | Description |
| --- | --- | --- |
| [root](/v3/reference/theming/keys/FieldGroup.md#theme-key-FieldGroup-root) | 2 classes | The stack for related fields and nested field groups. It establishes the field-group container query used by responsive fields and tightens spacing for checkbox and radio groups. |

<a id="theme-key-FieldGroup-root"></a>

## root

> The stack for related fields and nested field groups. It establishes the field-group container query used by responsive fields and tightens spacing for checkbox and radio groups.

Default classes:

```text
group/field-group @container/field-group flex w-full flex-col gap-7
data-[slot=checkbox-group]:gap-3 [&>[data-slot=field-group]]:gap-4
```

Source: `client/lib/theme/vueda-tailwind/shell/FieldGroup.theme.js:18`