# daisyUI Documentation - Fieldset Component

Fieldset is a container for grouping related form elements. It includes fieldset-legend as a title and label as a description.

## Classes and Usage

### Core Classes:
- **fieldset** - The main fieldset container
- **fieldset-legend** - The title of the fieldset
- **label** - Label for inputs (used for descriptions)

## Examples

### Basic Fieldset with Legend and Label

```html
<fieldset class="fieldset">
  <legend class="fieldset-legend">Page title</legend>
  <input type="text" class="input" placeholder="My awesome page" />
  <p class="label">You can edit page title later on from settings</p>
</fieldset>
```

### Fieldset with Background and Border

```html
<fieldset class="fieldset bg-base-200 border-base-300 rounded-box w-xs border p-4">
  <legend class="fieldset-legend">Page title</legend>
  <input type="text" class="input" placeholder="My awesome page" />
  <p class="label">You can edit page title later on from settings</p>
</fieldset>
```

### Fieldset with Multiple Inputs

```html
<fieldset class="fieldset bg-base-200 border-base-300 rounded-box w-xs border p-4">
  <legend class="fieldset-legend">Page details</legend>

  <label class="label">Title</label>
  <input type="text" class="input" placeholder="My awesome page" />

  <label class="label">Slug</label>
  <input type="text" class="input" placeholder="my-awesome-page" />

  <label class="label">Author</label>
  <input type="text" class="input" placeholder="Name" />
</fieldset>
```

### Fieldset with Join Items

```html
<fieldset class="fieldset bg-base-200 border-base-300 rounded-box w-xs border p-4">
  <legend class="fieldset-legend">Settings</legend>
  <div class="join">
    <input type="text" class="input join-item" placeholder="Product name" />
    <button class="btn join-item">save</button>
  </div>
</fieldset>
```

### Login Form with Fieldset

```html
<fieldset class="fieldset bg-base-200 border-base-300 rounded-box w-xs border p-4">
  <legend class="fieldset-legend">Login</legend>

  <label class="label">Email</label>
  <input type="email" class="input" placeholder="Email" />

  <label class="label">Password</label>
  <input type="password" class="input" placeholder="Password" />

  <button class="btn btn-neutral mt-4">Login</button>
</fieldset>
```

## Features

- Groups related form elements together
- Provides semantic structure for forms
- Uses fieldset-legend as the title
- Can include descriptive labels
- Works well with other daisyUI components like inputs and buttons
- Customizable with Tailwind classes

This component is useful for organizing form elements into logical groups, improving accessibility and user experience in complex forms.