How to style console.log();

I guess that your first code of JS was

console.log('Hello World')

even, mine was the same 🤏

So, have you wondered about styling it? 🤔

nevermind...

I am going to take the Discord warning message into account as an example

Discord Console Warning Message

• If you have ever opened developer tools in Discord, you will find this warning msg from Discord... Check it out right now if you haven't (and listennn, don't paste any malicious code there)
• So let's recreate the same warning message
• Write some necessary HTML to link a JS file to it
• Create a JS file and name it whatever you want
• Now follow the steps below

  console.log(text, styling)
  

  When you style there will be two things you need to take note of.
• text - Every text message starts with a prefix - %c; and it is a very important thing and without it, styling will not apply to the text
• styling - Simple CSS

Let's head up to the code,

console.log('%cHold Up', 'color: #404EED; font-size: 60px; font-weight: bold;-webkit-text-stroke: 1px black;');
console.log("%cIf someone told you to copy/paste something here you have an 11/10 chance you're being scammed", "color: black; font-size: 18px;")
console.log("%cPasting anything in here could give attackers access to your Discord account.", "color: red; font-size: 18px; font-weight: bold;")

So, found this simple? If not you can dive into comments to ask questions...

Why not share your styling to the console.log(), I am very excited to see yours

Make sure to subscribe to my YouTube Channel I regularly upload some amazing web development videos...

Your support gives me motivation 💪