Any way of detecting whether a browsers console is able to render colors?

Question

Is there a way of checking to see if a browser is capable of using console colors without sniffing?

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


        

Answer 1

I wrote Console.js https://github.com/icodeforlove/Console.js to allow us to do this a bit easier

Console.styles.register({
  red: 'color: red',
  underline: 'text-decoration: underline',
  bold: 'font-weight: bold'
});

then you can just do this

console.log('red text '.red + 'red underlined text'.red.underline + 'red bold text'.red.bold);

it will gracefully degrade like this

Answer 2

This is one of these few cases where browser version detection seems the valid way to go. To minimize the dangers of this approach make sure to use a blacklist rather than a whitelist, no matter how unintuitive this might feel right now (to make sure you don't leave out new future browser as happened with a lot of old netscape focused code). I am aware that this isn't the answer you wanted to hear, but as console.log is a native function and it's effect can in no way be observed, so as far as I can see the only option is to do browser version detection.