---
title: Field
category: Forms
summary: Composes [InputLabel](/inputlabel) and passes an `id` to the first child to pair labels and controls automatically.
---

```jsx live
render(
  <StackView width={60} spacing={4}>
    <Field inline label="First Name" helpContent="What's my name again?">
      <Input />
    </Field>

    <Field
      state="error"
      feedbackText="Select at least one choice, Name cannot be blank"
    >
      <Select state="error">
        <Select.Option value="1">One</Select.Option>
        <Select.Option value="2">Two</Select.Option>
        <Select.Option value="3">Three</Select.Option>
      </Select>
      <Input placeholder="Name" state="error" />
    </Field>

    <FieldSet margin={0}>
      <Field label="First Name">
        <Input />
      </Field>

      <Field label="Last Name" helpContent="Where to find your last name.">
        <Input />
      </Field>
    </FieldSet>
  </StackView>
)
```