console.log red text on yellow background

How to console.log red text on yellow background

Personal Experience

As a web developer, I often use the console.log method to debug my JavaScript code. At times, I want to make certain log messages stand out more than others. One way I have achieved this is by changing the background color and text color of specific console.log messages.

Code Example

To console.log red text on yellow background, we can use the following code:


console.log('%c Your message here ', 'background: yellow; color: red;');

This code uses the console.log method with two arguments. The first argument is the message that we want to log, and the second argument is a string containing CSS styles that we want to apply to the message.

The %c placeholder in the message string tells console.log that we want to apply styles to the message. We then pass a string containing CSS styles as the second argument.

We can customize the background and text color by changing the values of the 'background' and 'color' properties in the CSS string.

Another way

Another way to console.log red text on yellow background is by using template literals and string interpolation:


console.log(`%c Your message here `, `background: yellow; color: red;`);

This code achieves the same result as the previous example, but uses template literals instead of string concatenation.

Conclusion

In conclusion, we can console.log red text on yellow background using the console.log method with CSS styles as a second argument. We can customize the background and text color by changing the values of 'background' and 'color' properties. We can also achieve the same result using template literals and string interpolation.

Subscribe to The Poor Coder | Algorithm Solutions

Don’t miss out on the latest issues. Sign up now to get access to the library of members-only issues.
[email protected]
Subscribe