this is my user Form:
I have a problem, the color of input field is white, and the background is same white. I could not find anywhere How to change the color of input field.
What the attribute css for color texte ?
this is my template :
<div class="example-container" style="color:red">
<mat-form-field>
<input matInput placeholder="Input">
</mat-form-field>
<mat-form-field>
<textarea matInput placeholder="Textarea"></textarea>
</mat-form-field>
<mat-form-field>
<mat-select placeholder="Select">
<mat-option value="option">Option</mat-option>
</mat-select>
</mat-form-field>
</div>
new contact
Using --> ::ng-deep. mat-form-field-ripple { /*change color of underline when focused*/ background-color: green ! important;; } works. Great,you should also try with material custom themes.
Matinput is an Angular directive that primarily allows input and text area elements to work with a form field. With this, you can display placeholders perfectly, add custom error messages, a clear button, specify the maximum length of the text or add prefixes and suffixes for a seamless user experience.
Configuring the mat-datepicker-toggle icon The matSuffix is a configuration directive for the material input field, that will ensure that the calendar icon is added at the end (to the right) of the input field.
Here is some most common properties of angular material v7
/* input color class */
::ng-deep input.mat-input-element {
color: #484a4c;
}
/* Change label color on focused */
::ng-deep .mat-form-field.mat-focused .mat-form-field-label {
color: #50d0fb !important;
}
/* underline border color on focused */
::ng-deep .mat-focused .mat-form-field-underline .mat-form-field-ripple{
background-color: #50d0fb !important;
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With