Demo of Embedded SVGs

<h1 id="demo-of-embedded-svgs">Demo of Embedded SVGs</h1> <p>This article demonstrates how embedded SVG images appear when encoded with base64 and included in Markdown.</p> <h2 id="simple-circle-svg">Simple Circle SVG</h2> <p>Below is a simple red circle created with SVG:</p> <p><img src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAiIGhlaWdodD0iMTAwIiB2aWV3Qm94PSIwIDAgMTAwIDEwMCI+CiAgPGNpcmNsZSBjeD0iNTAiIGN5PSI1MCIgcj0iNDAiIHN0cm9rZT0iYmxhY2siIHN0cm9rZS13aWR0aD0iMyIgZmlsbD0icmVkIiAvPgo8L3N2Zz4=" alt="Red Circle" /></p> <h2 id="hexagon-svg">Hexagon SVG</h2> <p>Here's a blue hexagon created with SVG:</p> <p><img src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMDAiIGhlaWdodD0iMTgwIiB2aWV3Qm94PSIwIDAgMjAwIDE4MCI+CiAgPHBvbHlnb24gcG9pbnRzPSIxMDAsNSA1LDUwIDUsNTAgNSwxMzAgNSwxMzAgMTAwLDE3NSAxOTUsMTMwIDE5NSwxMzAgMTk1LDUwIDE5NSw1MCAxMDAsNSIgc3Ryb2tlPSJibGFjayIgc3Ryb2tlLXdpZHRoPSIzIiBmaWxsPSIjMDA5OWZmIiAvPgo8L3N2Zz4=" alt="Blue Hexagon" /></p> <h2 id="interactive-svg-example">Interactive SVG Example</h2> <p>This SVG changes color on hover (note that interactivity may not work in all contexts):</p> <p><img src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNTAiIGhlaWdodD0iMTAwIiB2aWV3Qm94PSIwIDAgMTUwIDEwMCI+CiAgPHJlY3QgeD0iMTAiIHk9IjEwIiByeD0iMTAiIHJ5PSIxMCIgd2lkdGg9IjEzMCIgaGVpZ2h0PSI4MCIgc3Ryb2tlPSJibGFjayIgc3Ryb2tlLXdpZHRoPSIzIiBmaWxsPSJncmVlbiI+CiAgICA8YW5pbWF0ZSBhdHRyaWJ1dGVOYW1lPSJmaWxsIiB2YWx1ZXM9ImdyZWVuO3llbGxvdztncmVlbiIgZHVyPSIzcyIgcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiIC8+CiAgPC9yZWN0Pgo8L3N2Zz4=" alt="Interactive SVG" /></p> <h2 id="conclusion">Conclusion</h2> <p>The examples above demonstrate how SVG images can be embedded directly into Markdown using base64 encoding. This approach allows for vector graphics to be included without requiring external image files.</p> <p>Testing these embedded SVGs helps us understand how our website handles this type of content and whether the SVGs render correctly across different devices and browsers.</p>