Demo
x
1
2
3
4
5
<div class="">
  <label class="block mb-2.5 text-sm font-medium text-heading" for="person_email">Email</label>
  <input class="bg-neutral-secondary-medium border border-default-medium text-heading rounded-base focus:ring-brand focus:border-brand block w-full shadow-xs placeholder:text-body px-3 py-2.5 text-sm" aria-describedby="person_email_hint" type="text" value="john.doe@company.com" name="person[email]" id="person_email" />
  <p class="mt-2.5 text-sm text-body" id="person_email_hint">We’ll never share your details.</p>
</div>
1
2
3
4
5
6
7
render(
  Flowbite::InputField::Text.new(
    attribute: :email,
    form: form,
    hint: {content: "We’ll never share your details."}
  )
)

Use this example to show a helper text below the input field for additional explanation and links.

No params configured.