<?xml version="1.0" encoding="UTF-8"?>
<svg
        width="64"
        height="64"
        viewBox="0 0 64 64"
        version="1.1"
        xmlns="http://www.w3.org/2000/svg"
        xmlns:xlink="http://www.w3.org/1999/xlink">

    <!--
      Define a linear gradient for the ring and text.
      Goes from deep purple (#4B0082) to aqua (#00FFFF).
    -->
    <defs>
        <linearGradient id="favGradient" x1="0" y1="0" x2="1" y2="0">
            <stop offset="0%" stop-color="#4B0082" />
            <stop offset="100%" stop-color="#00FFFF" />
        </linearGradient>
    </defs>

    <!-- Background is transparent. You could add a circle with a solid fill if desired. -->

    <!--
      Outer ring (circle) with no fill, just a gradient stroke.
      Stroke-width is set a bit thicker so it's visible at small sizes.
    -->
    <circle
            cx="32"
            cy="32"
            r="28"
            fill="none"
            stroke="url(#favGradient)"
            stroke-width="4"
    />

    <!--
      "AI" Text in the center, using the same gradient.
      A bold font and decent size will help keep it readable at small favicon resolutions.
    -->
    <text
            x="50%"
            y="50%"
            text-anchor="middle"
            dominant-baseline="central"
            font-family="Arial, Helvetica, sans-serif"
            font-weight="bold"
            font-size="24"
            fill="url(#favGradient)">
        D𝚵S
    </text>

</svg>