Bulma Textarea Colors

Last Updated : 20 Jan, 2022

Bulma is a free, open-source CSS framework based on Flexbox. It is component rich, compatible, and well documented. It is highly responsive in nature. It uses classes to implement its design.

The Bulma textarea form element is the multi-line version of the input element. We will use <textarea> element with textarea class to create textarea element in Bulma.

The Bulma Textarea Color is used to set the border color of textarea element.

Bulma Textarea Colors Classes:

is-primary: It is used to set the textarea color to light cyan.
is-link: It is used to set the textarea color to blue.
is-info: It is used to set the textarea color to light blue.
is-success: It is used to set the textarea color to green.
is-warning: It is used to set the textarea color to yellow.
is-danger: It is used to set the textarea color to red.

Syntax:

<textarea class="textarea is-primary" 
    placeholder="Primary textarea">
</textarea>

Example: This example describe the uses of Bulma Textarea Colors.

HTML

<!DOCTYPE html> 
<html> 
  
<head> 
    <title>Bulma Textarea Colors</title> 
    <link rel='stylesheet' 
          href= 
'https://cdn.jsdelivr.net/npm/bulma@0.9.3/css/bulma.min.css'> 
</head> 
  
<body class="has-text-centered"> 
    <h1 class="is-size-1 has-text-success"> 
        GeeksforGeeks 
    </h1> 
    <p class="is-size-3">Bulma Textarea Colors</p> 
  
  
    <div class="container"> 
        <textarea class="textarea is-success" 
                  placeholder="Enter the text"> 
        </textarea> 
        <br> 
  
        <textarea class="textarea is-danger" 
                  placeholder="Enter the text"> 
        </textarea> 
    </div> 
</body> 
  
</html>