svg格式的logo用什么制作，比如segmentfault这个logo是怎么做的？

Question

svg格式的logo用什么制作，比如segmentfault这个logo是怎么做的？

illustrator制作的用的是css，而本站制作的没有css，对比如下：

本站显示的结果
https://static.segmentfault.c...
代码是这样的：

<svg width="176" height="33" viewBox="0 0 176 33" xmlns="http://www.w3.org/2000/svg">
    <title>logo</title>
    <g fill="none" fill-rule="evenodd">
        <path d="M1.422 20.994c1.084.993 2.642 1.884 4.132 1.884 1.083 0 2.302-.48 2.302-1.781 0-1.44-1.659-1.679-3.522-2.502-2.1-.925-3.86-2.056-3.86-4.763 0-3.529 2.81-5.037 6.298-5.037 1.896 0 3.928.445 5.384 1.404v.411l-1.354 2.707c-.948-.72-2.235-1.2-3.657-1.2-1.253 0-2.032.515-2.032 1.508 0 1.303 1.49 1.577 3.352 2.296 2.574.993 4.131 2.09 4.131 4.865 0 3.632-2.81 5.209-6.535 5.209-2.37 0-4.267-.651-6.062-2.022v-.41l1.423-2.57zm20.014 5.003c-5.52 0-7.755-3.872-7.755-8.703 0-4.763 2.066-8.498 7.518-8.498 5.25 0 7.112 3.427 7.112 7.881 0 .514-.136 1.44-.34 1.988-1.286 0-9.176-.068-9.515-.068.034 1.815.813 4.214 3.522 4.214 1.388 0 2.54-.72 3.556-1.816l1.93 2.193v.411c-1.626 1.439-3.522 2.398-6.028 2.398zm-.238-13.843c-1.659 0-2.607 1.302-2.708 4.01.372 0 5.079-.104 5.249-.104-.001-2.57-.746-3.906-2.54-3.906zm23.298.206v13.876c0 4.729-3.522 6.716-7.383 6.716-2.167 0-4.504-.582-6.332-1.679L32 28.223h.406c1.219.823 2.743 1.371 4.2 1.371 1.997 0 3.114-1.028 3.114-2.81 0-.274.102-1.85.17-2.81l-.136-.068c-1.152 1.063-2.54 2.056-4.436 2.056-4.639 0-5.756-4.283-5.756-8.67 0-4.282 1.727-8.497 5.858-8.497 1.829 0 3.285.823 4.504 1.954l.102-.069.338-1.2.373-.342 3.86.103c-.033.343-.101 2.09-.101 3.118zm-4.741 1.37c-.746-.857-1.761-1.37-2.675-1.37-2.27 0-2.54 3.083-2.54 4.934 0 2.021.102 5.413 2.235 5.413.948 0 2.133-.788 2.912-1.781 0-.343.068-6.82.068-7.196zm25.058 11.821c0-.308.136-10.485.136-10.793 0-1.713-.44-2.365-1.49-2.365-.779 0-1.862.446-2.709 1.13v12.028h-4.673c0-.308.068-10.485.068-10.793 0-1.713-.406-2.365-1.388-2.365-.812 0-1.93.48-2.776 1.166l.033 11.992h-4.808V13.456c0-1.166-.068-3.495-.102-4.215l3.996-.103.372.343.238 1.337.067.034c1.456-1.2 3.488-2.022 5.215-2.022 1.354 0 2.641.617 3.285 2.09 1.658-1.302 3.793-2.09 5.52-2.09 2.2 0 3.928 1.37 3.928 4.866 0 .343-.102 11.513-.102 11.855h-4.81zm14.629.446c-5.52 0-7.754-3.872-7.754-8.703 0-4.763 2.066-8.498 7.517-8.498 5.25 0 7.112 3.427 7.112 7.881 0 .514-.135 1.44-.339 1.988-1.287 0-9.177-.068-9.516-.068.034 1.815.813 4.214 3.522 4.214 1.389 0 2.54-.72 3.556-1.816l1.93 2.193v.411c-1.626 1.439-3.522 2.398-6.028 2.398zm-.237-13.843c-1.66 0-2.608 1.302-2.709 4.01.373 0 5.08-.104 5.25-.104-.002-2.57-.746-3.906-2.541-3.906zm18.15 13.397c0-.308.135-10.485.135-10.793 0-1.748-.406-2.365-1.558-2.365-.846 0-2.066.549-2.98 1.166l.034 11.992h-4.809V13.456c0-1.2-.067-3.495-.101-4.215l3.995-.103.373.343.237 1.337.068.034c1.524-1.13 3.725-2.022 5.52-2.022 2.268 0 3.995 1.37 3.995 4.866 0 .343-.102 11.513-.102 11.855h-4.807zm12.935 0c-4.232 0-4.537-2.467-4.537-4.865 0-.343 0-4.798.068-8.019-1.05.035-1.727.035-2.065.035l.034-3.461c.339 0 .982 0 2.031.034a635.539 635.539 0 0 1-.068-4.626l.34-.343h4.47c0 .309 0 2.365-.068 4.969 1.185-.034 2.777-.034 3.115-.034l-.067 3.46c-.34 0-1.863 0-3.048-.034.034 3.118.034 7.127.034 7.436 0 1.713.033 2.055 1.523 2.055h1.32l.069 3.05-.339.343h-2.811z"
              fill="#333"/>
        <path d="M117.62 25.551c0-.343.069-9.663.103-12.884-.915.035-1.863.035-2.134.035l.034-3.461c.27 0 1.185 0 2.066.034 0-.137-.068-2.981-.068-3.084 0-3.872 2.235-5.311 5.147-5.311 1.253 0 2.54.206 3.827.754v.514l-.982 2.74c-.542-.307-1.151-.48-1.693-.48-.948 0-1.558.48-1.558 2.296 0 .617.034 2.433.034 2.57 1.016-.034 2.946-.034 3.216-.034l-.033 3.46c-.271 0-2.202 0-3.217-.033.068 3.22.068 12.54.068 12.883h-4.81v.001zm18.964 0l-.339-.343-.406-1.302-.135-.034c-1.457 1.336-3.082 2.124-5.08 2.124-3.623 0-4.266-3.152-4.266-5.002 0-5.277 4.47-5.586 9.143-5.86v-1.062c0-1.507-.982-1.885-2.167-1.885-2.1 0-4.03.686-5.181 1.13l-1.05-2.74v-.411a22.039 22.039 0 0 1 7.619-1.37c3.352 0 5.553 1.404 5.553 5.07v7.745c0 1.336.068 3.255.102 3.94h-3.793zm-1.05-7.846c-3.183.068-4.57.103-4.57 2.672 0 1.2.304 2.33 1.59 2.33.813 0 1.931-.445 2.947-1.507 0-.206.068-3.255.068-3.461l-.035-.034zm17.88 7.846l-.34-.343-.406-1.37-.135-.035c-1.794 1.714-3.658 2.193-5.52 2.193-2.472 0-4.267-1.37-4.267-4.865 0-.343.102-11.547.102-11.89h4.47l.34.343c0 .377-.103 10.21-.103 10.656 0 1.233.407 2.398 1.626 2.398 1.016 0 2.37-.685 3.183-1.541l-.068-11.856h4.47l.339.343v12.027c0 1.337.068 3.255.101 3.94h-3.792zm11.14-3.941c0 1.303.069 3.256.136 3.941h-4.808c-.069-.685-.136-2.639-.136-3.94V5.403c0-1.302-.034-3.254-.102-3.94l4.572-.137.338.343v19.942zm8.128 3.941c-4.233 0-4.537-2.467-4.537-4.865 0-.343 0-4.798.068-8.019-1.05.035-1.727.035-2.066.035l.034-3.461c.34 0 .982 0 2.032.034a635.519 635.519 0 0 1-.068-4.626l.339-.343h4.47c0 .309 0 2.365-.068 4.969 1.186-.034 2.777-.034 3.115-.034l-.067 3.46c-.339 0-1.862 0-3.048-.034.034 3.118.034 7.127.034 7.436 0 1.713.034 2.055 1.524 2.055h1.32l.068 3.05-.339.343h-2.81z"
              fill="#009A61"/>
    </g>
</svg>

用illustrator随意做了一个，显示是这样的：

代码是这样的：

<svg id="图层_1" data-name="图层 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 300 80">
    <defs>
        <style>.cls-1 {
            font-size: 50px;
            font-family: MicrosoftYaHei-Bold, Microsoft YaHei;
            font-weight: 700;
            letter-spacing: -0.08em;
        }

        .cls-2 {
            fill: #3eb287;
        }</style>
    </defs>
    <title>画板 1</title>
    <text class="cls-1" transform="translate(4.93 55.17)">segment
        <tspan class="cls-2" x="190.31" y="0">fault</tspan>
    </text>
</svg>

可以看出，illustrator制作的是用css显示的。

问题：
怎么制作不使用css的svg？也就是像本站的那样。

Answer 1

illustrator 中将文字转为 path 就行

Answer 2

1. 手写
2. 专业点的用 Adobe 家的 illustrator
3. 普通用有开源的 inkscape https://inkscape.org/