Unable to change the text area background color

you can try to use some class definitions and set them to the class property.

So for  example in the App.css // Studio >>> STYLE >> Application

.my_transp_area {
 background: transparent;
 }
.textarea1 {
 background-color:transparent; 
 background: transparent;
 line-height:30px;
 font-weight:bold;
 color:black;
 opacity:0.4 ; 
} 

and then set this to the class property (for Card and textarea widgets)

So this will make some effects of transparent apperance  but the sample style will   also affect the text itself (opacity ) attribute. So changing it back to not transparent value will show  the text lines non transparent - deepening of the setting of the textarea widget rows property 

To understand better what I meant here you can use the style textarea2  instead of  textarea1 :

.textarea2 {
 width: 20%;
 height: 150px;
 padding: 12px 20px;
 box-sizing: border-box;
 border: 2px solid #ccc;
 border-radius: 20px;
 font-size: 16px;
 resize: none;
 background-color:transparent; 
 background: rgba(204, 204, 204, 0.2);
 line-height:30px;
 font-weight:bold;
 opacity:0.7 ;
 
}