Discover how you can use CSS, SVGs, and HTML in console messages to create unique effects. Find out the differences between console.log and console.info. Explore the capabilities and limitations of non-text elements in the console.
Table of contents
How to use CSS, SVGs, and HTML in a console messageExploring the capabilities of non-text in the consoleRendering HTML inside of the SVGExample effects to inspire youIncluding a link inside of the designResponsive sizingDetecting whether or not the console is openPerformance impactBrowser supportTooling that makes this easierNotable mention: css-doodleNotable mention: CSS text effectsNotable mention: ASCII artNotable mention: EmojisGo forth and delight!2 Comments
Sort: