Thanks for the report.  It does seem confusing that DevTools warns the developer that an image is unused even though the resource can be clearly seen in the console.  However, I believe this is working as intended.

Console.log behavior with '%c' is not specified, as far as I'm aware.  For Chrome's implementation, specifying a background image tells the DevTools-context to load the image, not the inspected-page-context.  The request for the image fired by the console.log('...') doesn't actually happen in the inspected page, which is why it doesn't suppress the warning.

DevTools itself is a webapp with HTML, and it's capable of using rel="preload".  We can imagine evaluating the `console.log('..image..')` in this DevTools console.  If one opens a new DevTools to inspect the original DevTools instance, I would expect that the new DevTools' console would report the 'unused-preload' warning if the first DevTools instance violated the rule in its context.


That said, we are currently working on better presenting and organizing console violations/warnings that are more useful and not distracting, and hopefully it will help reduce confusing situations like this :)

Please feel free to ask further questions.

Thanks for your clarification! Can I say that in the future the situation I describe will get improved even make it can use rel="preload"?

No, for this case, the warning is still going to be presented in the future.  But we plan on bringing easier options to group warnings like this together, in some UX that should be less cluttered.

Ok, got it.Thanks for your clarification!