How to change the font-color of disabled input using CSS ? Last Updated : 08 Aug, 2021 Summarize Comments Improve Suggest changes Share Like Article Like Report In this article, we are going to learn how to change the font-color of disabled input. There is a method to solve this problem, which is discussed below: Approach: With adding basic CSS property we are able to change the font-color of a disabled input. The disabled input element is unusable and un-clickable. This is a boolean attribute. Here using the color property of input we can change the font-color of this disabled input element. Below is the Syntax and implementation of the above approach: Syntax: HTML: <input disabled> CSS: input:disabled { color: black; } Example: html <!DOCTYPE html> <html> <head> <title> How to change font-color for disabled input using CSS? </title> <style> input { /*it makes grey background and white font-color of a input*/ background: grey; color: white; } input:disabled { /*css declaration to make font-color of disable input black*/ color: black; } </style> </head> <body> <form> Enable Input : <input value="Enabled"><br> <!-- Disabled this input using attribute: disable --> Disable Input: <input value="Disabled" disabled><br> </form> </body> </html> Output: Explanations: First input element is enabled and the second input element is disabled. Using CSS properties we have an initialized background of all input elements as grey and font-color as white. We have to change white font-color of the disabled input to any color. Comment More infoAdvertise with us Next Article How to Add Background Color in Input and Text Fields using CSS ? S srijan_de Follow Improve Article Tags : Web Technologies CSS Write From Home CSS-Questions Similar Reads How to Change Cursor Color using CSS? Changing the cursor color using CSS is an easy way to make your website look nicer. While you can't change the mouse cursor itself, you can change the color of the text cursor (the blinking line) in input fields. This helps make the text areas stand out and match your website's style.Approach to cha 3 min read How to Make Text Input Non-Editable using CSS? There are situations where you might want to create non-editable input fields. HTML and CSS both provide ways to achieve this.1. The read-only Attribute in HTMLThe read-only attribute in HTML is used to make a text input field non-editable, meaning users can see the content but cannot modify it. Thi 2 min read How to set Input Fields with Black Border on Focus using CSS ? The visual cues play a crucial role in guiding user interaction in web design. One common interaction is when users focus on input fields, such as text boxes or text areas, during form filling. To enhance the user experience, it's essential to provide clear feedback when an input field is in focus. 2 min read How to Add Background Color in Input and Text Fields using CSS ? In this article, we will explore different approaches to adding background color to input and text fields using CSS. Customizing the appearance of input and text fields is an essential aspect of web design, and changing the background color is a powerful way to enhance the visual appeal of these ele 2 min read How to create a Disabled Input using jQuery Mobile ? jQuery Mobile is a web based technology used to make responsive content that can be accessed on all smartphones, tablets and desktops. In this article, we will be creating a Disabled Input using jQuery Mobile. Approach: Add jQuery Mobile scripts needed for your project. <link rel=â€stylesheet†hre 1 min read How to change text selection color in the browsers using CSS ? Most of the browsers by default highlight the selected text in a blue background. This can be changed by using the ::selection pseudo selector in CSS. The ::selectionselector is used for setting the CSS property to the part of the document that is selected by the user (such as clicking and dragging 1 min read Like