Search code examples
placeholderquill

How to change font color for placeholder iQuill js text editor


I am using Quill js text editor, and I recently discovered it has the option to set up a placeholder text in its configuration.

var quill = new Quill('#editor', {
theme: 'snow',
placeholder: "some placeholder text..."
});

I did so, and now I am getting a placeholder properly shown inside my quill container. Anyway, since i am using Bootstrap theming, when i change from light mode to dark, the placeholder text font color remains black. The content of the editor when it has some, does toggle from blac to white color when toggling modes, but the placeholder won't.

Does anywone know how to overcome this issue?

Thanks in advance

I tried using my own custom styles, but doesn't seem to work

#quill-editor::placeholder {
    color: white;
}

Solution

  • You can change placeholder color by:

    .ql-editor.ql-blank::before {
        color: white;
    }