Can You Use CSS to Color Console Output in Chrome and Firefox?

Displaying Colors in JavaScript Console

Is it possible to use Chrome's console to display colored text, such as red for errors, orange for warnings, and green for console.log messages?

Answer

Yes, it is possible to use CSS to add colors to messages displayed in the console in both Chrome and Firefox (version 31 or later). To achieve this, use the following pattern:

console.log('%c Oh my heavens! ', 'background: #222; color: #bada55');

In this example, %c represents the CSS style to apply to the text, while the subsequent string inside single quotes defines the actual style rules. The CSS style rules can include properties such as background, color, and font-weight to format the text as desired.

The above is the detailed content of Can You Use CSS to Color Console Output in Chrome and Firefox?. For more information, please follow other related articles on the PHP Chinese website!