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

Text input

Component guide

Example




<div class="govuk-form-group">
  <h1 class="govuk-label-wrapper">
    <label class="govuk-label govuk-label--l" for="event-name">
      What is the name of the event?
    </label>
  </h1>


  <input
    
        
      
    
        
      
    
        
      
    
        
      
    
    
    
    
    
    
    
    
    
   class="govuk-input" id="event-name" name="eventName" type="text">

</div>

{{ govukInput({
  "label": {
    "text": "What is the name of the event?",
    "classes": "govuk-label--l",
    "isPageHeading": true
  },
  "id": "event-name",
  "name": "eventName"
}) }}