Easily create Textarea with different styles using our component based on Taco. 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.
<Textarea label="Message" color="blue" />
The Textarea component comes with 3 different variants that you can change it using the variant prop.
<Textarea label="Outlined" color="blue" variant="outlined" /> <Textarea label="Standard" color="blue" variant="standard" /> <Textarea label="Static" color="blue" variant="static" />
The Textarea component comes with 2 different sizes that you can change it using the size prop.
<Textarea label="Textarea Medium" color="blue" size="md" /> <Textarea label="Textarea Large" color="blue" size="lg" />
The Textarea component comes with 19 different colors that you can change it using the color prop, below there are some examples of the colors but you can check all of the them here.
<Textarea label="Textarea Blue" color="blue" /> <Textarea label="Textarea Purple" color="purple" /> <Textarea label="Textarea Indigo" color="indigo" /> <Textarea label="Textarea Teal" color="teal" />
The Textarea component comes with error and success states for performing validations.
<Textarea label="Textarea Error" error /> <Textarea label="Textarea Success" success />
A Textarea could be disabled as well, it will help you to prevent user interactions like click or focus over the Textarea component.
<Textarea label="Disabled" color="blue" disabled />
<Textarea v-model="" color="blue" :disabled="false" label="Message" :error="false" :success="false" :resize="true" variant="outlined" size="md" > </Textarea>