Skip to main content
Component Pad – Experimental – output can be wrong
GOV.UK Frontend

Textarea

Component guide

Example

Do not include personal or financial information, like your National Insurance number or credit card details



<div class="govuk-form-group">
  <h1 class="govuk-label-wrapper">
    <label class="govuk-label govuk-label--l" for="more-detail">
      Can you provide more detail?
    </label>
  </h1>

  
  
  <div id="more-detail-hint" class="govuk-hint">
    Do not include personal or financial information, like your National Insurance number or credit card details
  </div>



  <textarea class="govuk-textarea" id="more-detail" name="moreDetail" rows="5" aria-describedby="more-detail-hint"></textarea>

</div>

{{ govukTextarea({
  "name": "moreDetail",
  "id": "more-detail",
  "label": {
    "text": "Can you provide more detail?",
    "classes": "govuk-label--l",
    "isPageHeading": true
  },
  "hint": {
    "text": "Do not include personal or financial information, like your National Insurance number or credit card details"
  }
}) }}