diff --git a/groups.md b/groups.md
index f12212d..acd7264 100644
--- a/groups.md
+++ b/groups.md
@@ -32,17 +32,152 @@ would produce (simplified) HTML output something like this:
```html
```
+## Tags
+
+### Default
+
You can change the default `fieldset` tag by passing the `tag` property to the `` component in your markup.
```html
```
+
+### Per group
+
+You can also change the `fieldset` tag per group by adding a tag to the group definition:
+
+```js
+{
+ groups: [
+ {
+ tag: "section",
+ ...
+ }
+ ]
+}
+```
+
+## Subgroups
+
+You can create a subgroup by adding a `groups` definition inside of a top-level `groups` definition. This is useful for grouping sections of large forms.
+
+```js
+{
+ groups: [
+ {
+ legend: "User Details",
+ fields: [
+ {
+ type: "input",
+ inputType: "text",
+ label: "Name",
+ model: "name"
+ },
+ {
+ type: "input",
+ inputType: "number",
+ id: "current_age",
+ label: "Age",
+ model: "age"
+ }
+ ],
+ groups: [
+ {
+ legend: "Location",
+ fields: [
+ {
+ type: "input",
+ inputType: "text",
+ label: "City"
+ },
+ {
+ type: "input",
+ inputType: "text",
+ label: "State"
+ }
+ ]
+ }
+ ]
+ }
+ ]
+}
+```
+
+would produce (simplified) HTML output something like this:
+
+```html
+
+```
+
+### Bootstrap Vue Example
+
+Using custom tags, subgroups, and the `legendAttr` option, forms can be grouped using custom Vue components. The `legendAttr` option will render the legend text into the attribute you specify. The below example uses bootstrap-vue to render subgroups in tabs:
+
+```js
+{
+ groups: [
+ {
+ tag: "b-tabs",
+ legend: "Additional Info",
+ groups: [
+ {
+ tag: "b-tab",
+ legend: "Location",
+ legendAttr: "title",
+ fields: [
+ {
+ type: "input",
+ inputType: "text",
+ label: "City"
+ },
+ {
+ type: "input",
+ inputType: "text",
+ label: "State"
+ }
+ ]
+ },
+ {
+ tag: "b-tab",
+ legend: "Demographics",
+ legendAttr: "title",
+ fields: [
+ {
+ type: "input",
+ inputType: "number",
+ label: "Age",
+ model: "age"
+ }
+ ]
+ }
+ ]
+ }
+ ]
+}
+```