Hello 👋 Guys Hope you are safe and happy. so in this blog i will tell you that how you can style console.log using javascript and CSS 😊
Q. Why We Need To Style Console.log And When ?
Ans - You have seen many social media websites such as Facebook or Google Plus, where they have big red text appearing in the console saying "WARNING!" or similar to prevent you from entering malicious code. There are many reasons for styling console.log but the main purpose is to prevent users from entering malicious code in the website 😊
To style console.log follow my steps 😊
When you console something it looks normal and not very cool looking but to style it we need to put "%c" attached to the text
Check this code and if you want to test it just open the dev tools and go to console and then paste the code so that you can see the output...
Code.
console.log("Here comes the text you want to display to the users", "and then put your css styles here to decorate the text");
console.log("%cStyled Text", "color: #fff; background: #000; padding: 12px; font-family: Poppins; font-size: 20px; font-weight: bold;");
Thankyou Guys for giving your time and reading this hope you are safe and Happy...
Also don't forget to subscribe 🌟⚡ to my youtube channel
Top comments (3)
And if you want to see some really wild creations made by styling console.log() check out my console.draw() project here: codepen.io/brandonmcconnell/full/W... 😁
Wow that is amazing, You made a very great project..
Hello 👋 Guys hope you are safe and Happy
Also don't forget to subscribe 🌟⚡