Skip to content
+

Fieldset

Fieldsets group multiple fields together with a label. This is a light wrapper over the native `fieldset` and `legend` elements, but makes the `legend` element easily stylable.

FieldsetLegend API

Import

import * as Fieldset from '@base_ui/react/Fieldset';
const FieldsetLegend = Fieldset.Legend;

Props

Props of the native component are also available.

NameTypeDescription
classNamefunc
| string

Class names applied to the element or a function that returns them based on the component's state.

renderelement
| func

A function to customize rendering of the component.


The ref is forwarded to the root element.

Theme default props

You can use FieldsetLegend to change the default props of this component with the theme.

FieldsetRoot API

Import

import * as Fieldset from '@base_ui/react/Fieldset';
const FieldsetRoot = Fieldset.Root;

Props

Props of the native component are also available.

NameTypeDescription
classNamefunc
| string

Class names applied to the element or a function that returns them based on the component's state.

renderelement
| func

A function to customize rendering of the component.


The ref is forwarded to the root element.

Theme default props

You can use FieldsetRoot to change the default props of this component with the theme.