Tips & Tricks #2

Can I apply style to the log statements in the console?

Chrome

1. Open console using Cmd+Option+J or Ctrl+Shift+J.

2. Prefix the log statement with %c, and supply the CSS styles as the second argument to console.log().

   

DevTools showing stylised log statements in the console. More info.

---

Firefox

1. Open console using Cmd+Option+J or Ctrl+Shift+J.

2. Prefix the log statement with %c, and supply the CSS styles as the second argument to console.log().

DevTools showing stylised log statements in the console. More info.

---

Safari

1. Open console using Cmd+Option+J or Ctrl+Shift+J.

2. Prefix the log statement with %c, and supply the CSS styles as the second argument to console.log().

DevTools showing stylised log statements in the console. More info.

---

Edge

1. Open console using Cmd+Option+J or Ctrl+Shift+J.

2. Prefix the log statement with %c, and supply the CSS styles as the second argument to console.log().

DevTools showing stylised log statements in the console. More info.

---

Opera

1. Open console using Cmd+Option+J or Ctrl+Shift+J.

2. Prefix the log statement with %c, and supply the CSS styles as the second argument to console.log().

DevTools showing stylised log statements in the console. More info.