Textarea

An input component that represents a multiline text area. It is used to capture lengthy text written by the user, such as comments, descriptions, or observations.

Basic Usage

<textarea
  class="textarea"
  placeholder="Agregue una pequeña descripcion"
></textarea>

Disabled

Preview

Code

<textarea
  class="textarea"
  placeholder="Agregue una pequeña descripcion"
  disabled=""
></textarea>

Field

Use the Field component to compose a textarea with a label, help text, and error message.

tip

For more information, visit the field documentation.

Preview

Descripción Debe tener menos de 200 caracteres

Code

<div class="field">
  <label class="label">Descripción</label>
  <textarea
    class="textarea"
    placeholder="Ingresa una pequeña descripción"
  ></textarea>

  <!--  Opcional  -->
  <span class="help">Debe tener menos de 200 caracteres</span>
</div>

Colors

is-valid

Preview

Descripción Debe tener menos de 200 caracteres

Code

<div class="field is-valid">
  <label class="label">Descripción</label>
  <textarea
    class="textarea"
    placeholder="Ingresa una pequeña descripción"
  ></textarea>

  <!--  Opcional  -->
  <span class="help">Debe tener menos de 200 caracteres</span>
</div>

is-invalid

Preview

Descripción Debe tener menos de 200 caracteres

Code

<div class="field is-invalid">
  <label class="label">Descripción</label>
  <textarea
    class="textarea"
    placeholder="Ingresa una pequeña descripción"
  ></textarea>

  <!--  Opcional  -->
  <span class="help">Debe tener menos de 200 caracteres</span>
</div>