Tailwind CSS

Easily create textarea with different styles using our component based on Tailwind CSS. It is useful when you want to allow users to enter a sizeable amount of free-form text, for example a comment on a review or feedback form.

Below we are presenting 3 examples of textarea components that you can use in your Tailwind CSS project.

Textarea Outline

Use this example to create outline textarea components.

<div class="input-group-outline input-group mb-6">
  <label class="form-label">Textarea Outline</label>
  <textarea type="text" class="form-control" rows="7"></textarea>
</div>

Textarea Dynamic

Use this example to create dynamic textarea components.

<div class="input-group input-group-dynamic mb-6">
  <label class="form-label">Textarea Dynamic</label>
  <textarea type="text" class="form-control" rows="7"></textarea>
</div>

Textarea Static

Use this example to create static textarea components.

<div class="input-group input-group-static mb-6">
  <label>Textarea Static</label>
  <textarea type="text" class="form-control" rows="7"></textarea>
</div>

Required Scrips

The textarea component needs a required script files to work, you just need to add the below script file to the bottom of your html file.

<script src="node_modules/@material-tailwind/html/scripts/input.js"></script>