Does anyone know what is the default color and font and size for placeholders for inputs and textareas?
<input type="text" name="input" placeholder="Select data"/> 4 2 Answers
Depending on your application / need, you could use a color picker tool, or you could use your Browser's developer console, to be sure. But...
The default input placeholder color varies by browser.
In your screenshot, it's #8e8e8e
Some examples by browser:
In Chrome (Mac) it's #a9a9a9
in Firefox (Mac) it's #777777
Bootstrap 3 does define a "default" placeholder color, which you can see by inspecting the CSS a variety of ways - below is from the CSS directly (For Bootstrap v3.3.7):
.form-control::-moz-placeholder{ color:#999; opacity:1
}
.form-control:-ms-input-placeholder{ color:#999
}
.form-control::-webkit-input-placeholder{ color:#999
}So - Bootstrap 3 defines the default placeholder color as #999. (For reference, Bootstrap 4 defines the default placeholder color as #636c72).
If you open up bootstrap.css file, and ctrl+f (find) and search for "form-control" and look for placeholder you will find:
.form-control::-moz-placeholder { color: #999; opacity: 1;
}
.form-control:-ms-input-placeholder { color: #999;
}
.form-control::-webkit-input-placeholder { color: #999;
}According to bootstraps documentation:
0Bootstrap's global default font-size is 14px, with a line-height of 1.428. This is applied to the and all paragraphs. In addition,
(paragraphs) receive a bottom margin of half their computed line-height (10px by default).