src/hello.svg

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
   width="1000"
   height="500"
   viewBox="0 0 210 296.99999"
   version="1.1"
   id="svg1"
   xml:space="preserve"
   inkscape:version="1.3 (0e150ed6c4, 2023-07-21)"
   sodipodi:docname="helo.svg"
   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
   xmlns="http://www.w3.org/2000/svg"
   xmlns:svg="http://www.w3.org/2000/svg">
   <style>
      @keyframes hello {
        0%{
          transform: matrix(0.51179792,0,0,0.51179792,-222.90642,-84.20424);
        }
        100% {
          transform: matrix(0.51179792,0,0,0.51179792,-222.90642,-35.684093);
        }
      }
      @keyframes gustavo {
        0%{
          transform: matrix(0.51179792,0,0,0.51179792,-556.51978,23.500175);
        }
        100% {
          transform: matrix(0.51179792,0,0,0.51179792,-222.90642,23.500175);
        }
      }
      @keyframes desc {
        0%{
          transform: matrix(0.18158449,0,0,0.18158449,-740.79137,80.49155);
        }
        100% {
          transform: matrix(0.18158449,0,0,0.18158449,-184.17721,80.49155);
        }
      }
      @keyframes jump {
        0%{
          opacity: 1;
          transform: matrix(0.03979528,0,0,0.03979528,-154.46738,224.08914);
        }
        100% {
          opacity: 1;
          transform: matrix(0.17053925,0,0,0.17053925,-171.20261,207.35391);
        }
      }
      @keyframes jump1 {
        0%{
          opacity: 1;
          transform: matrix(0.03979527,0,0,0.03979527,-103.3056,224.08914);
        }
        100% {
          opacity: 1;
          transform: matrix(0.17053925,0,0,0.17053925,-120.04083,207.35391);
        }
      }
      @keyframes jump2 {
        0%{
          opacity: 1;
          transform: matrix(0.03979527,0,0,0.03979527,-52.14383,224.08914);
        }
        100% {
          opacity: 1;
          transform: matrix(0.17053925,0,0,0.17053925,-68.87906,207.35391);
        }
      }
      @keyframes more {
        0%{
          transform: matrix(0.18158449,0,0,0.18158449,-184.17721,262.75556);
        }
        100% {
          transform: matrix(0.18158449,0,0,0.18158449,-184.17721,226.65997);
        }
      }
    </style>
   <sodipodi:namedview
     id="namedview1"
     pagecolor="#ffffff"
     bordercolor="#000000"
     borderopacity="0.25"
     inkscape:showpageshadow="2"
     inkscape:pageopacity="0.0"
     inkscape:pagecheckerboard="0"
     inkscape:deskcolor="#d1d1d1"
     inkscape:document-units="px"
     inkscape:zoom="0.47126122"
     inkscape:cx="299.19712"
     inkscape:cy="412.72227"
     inkscape:window-width="1366"
     inkscape:window-height="715"
     inkscape:window-x="-8"
     inkscape:window-y="-8"
     inkscape:window-maximized="1"
     inkscape:current-layer="layer1" /><defs
     id="defs1" /><g
     inkscape:label="Camada 1"
     inkscape:groupmode="layer"
     id="layer1">
     <text
       xml:space="preserve"
       style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:96px;line-height:0px;font-family:Consolas;-inkscape-font-specification:Consolas;letter-spacing:0.04px;opacity:0.902098;fill:#24a0e8;fill-opacity:0.99215686;stroke:#2091d2;stroke-width:4.82646;stroke-linejoin:miter;stroke-dasharray:none;stroke-opacity:0.98823529;paint-order:markers stroke fill;animation: hello 1s forwards;"
       x="94.42746"
       y="161.26936"
       id="text1"
       transform="matrix(0.51179792,0,0,0.51179792,-222.90642,-34.034561)"><tspan
         sodipodi:role="line"
         id="tspan1"
         x="94.42746"
         y="161.26936"
         style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:96px;font-family:Consolas;-inkscape-font-specification:Consolas;fill:#24a0e8;fill-opacity:0.99215686;stroke:#2091d2;stroke-width:4.82646;stroke-linejoin:miter;stroke-dasharray:none;stroke-opacity:1">Hello!</tspan></text>
     <text
       xml:space="preserve"
       style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:96px;line-height:0px;font-family:Consolas;-inkscape-font-specification:Consolas;letter-spacing:0.04px;opacity:0.902098;fill:#ffffff;fill-opacity:1;stroke:#ffffff;stroke-width:4.82646;stroke-linejoin:miter;stroke-dasharray:none;stroke-opacity:0.90196079;paint-order:markers stroke fill;animation: 1s gustavo forwards"
       x="94.42746"
       y="161.26936"
       id="text2"
       transform="matrix(0.51179792,0,0,0.51179792,-222.90642,23.500175)">
       <tspan
         id="tspan2"
         x="94.42746"
         y="161.26936"
         style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:96px;font-family:Consolas;-inkscape-font-specification:Consolas;fill:#ffffff;fill-opacity:1;stroke:#ffffff;stroke-width:4.82646;stroke-linejoin:miter;stroke-dasharray:none;stroke-opacity:0.90196079"
         sodipodi:role="line">I'm Gustavo;</tspan></text>
     <text
       xml:space="preserve"
       style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:96px;line-height:100.459px;font-family:Consolas;-inkscape-font-specification:Consolas;letter-spacing:0.04px;writing-mode:lr-tb;white-space:pre;inline-size:2972.14;opacity:0.902098;fill:#b3b3b3;fill-opacity:1;stroke:none;stroke-width:0;stroke-linejoin:miter;stroke-dasharray:none;stroke-opacity:1;paint-order:markers stroke fill;animation: 1s desc forwards"
       x="72.021896"
       y="306.09305"
       id="text4"
       transform="matrix(0.18158449,0,0,0.18158449,-184.17721,80.49155)"><tspan
         x="72.021896"
         y="306.09305"
         id="tspan4">`I'm an intermediate developer,&#10;</tspan><tspan
         x="72.021896"
         y="406.55207"
         id="tspan6"><tspan
           dx="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 -0.00020507723 0 0 0 0 0 -0.00020507723 0 0 0 0 0 0 -0.00020507723"
           id="tspan5">I create websites, APIs, websockets and bots for Discord&#10;</tspan></tspan><tspan
         x="72.021896"
         y="507.01105"
         id="tspan8"><tspan
           dx="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 -0.00020507723 0 0 0 0 0 -0.00020507723 0 0 0 0 0 0 -0.00020507723"
           id="tspan7">I like javascript and use it together with html and css </tspan></tspan><tspan
         x="72.021896"
         y="607.47004"
         id="tspan9">to develop my websites as shown below.`</tspan></text>
     <text
       xml:space="preserve"
       style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:96px;line-height:100.459px;font-family:Consolas;-inkscape-font-specification:Consolas;letter-spacing:0.04px;writing-mode:lr-tb;white-space:pre;inline-size:2972.14;opacity:0.902098;fill:#9d9d9d;fill-opacity:0.99215686;stroke:#000000;stroke-width:0;stroke-linejoin:miter;stroke-dasharray:none;stroke-opacity:1;paint-order:markers stroke fill;animation: 1s more forwards"
       x="72.021896"
       y="306.09305"
       id="text13"
       transform="matrix(0.18158449,0,0,0.18158449,-184.17721,226.65997)"><tspan
         x="72.021896"
         y="306.09305"
         id="tspan11"><tspan
           style="font-family:Arial;-inkscape-font-specification:Arial"
           id="tspan10">And I'm still willing to learn more</tspan></tspan></text>
     <g
       id="g2"
       transform="matrix(0.17053925,0,0,0.17053925,-171.20261,207.35391)"
       style="opacity:0;fill:none;animation: 0.3s jump cubic-bezier(0.23, 0.21, 0.54, 1.74) forwards"><svg
         width="256"
         height="256"
         viewBox="0 0 256 256"
         fill="none"
         version="1.1"
         id="svg2"><rect
           width="256"
           height="256"
           rx="60"
           fill="#f0db4f"
           id="rect1"
           x="0"
           y="0" /><path
           d="m 67.3117,213.932 19.591,-11.856 c 3.7794,6.701 7.2175,12.371 15.4643,12.371 7.905,0 12.889,-3.092 12.889,-15.12 v -81.798 h 24.058 v 82.138 c 0,24.917 -14.606,36.259 -35.916,36.259 -19.2447,0 -30.4161,-9.967 -36.0867,-21.996"
           fill="#323330"
           id="path1" /><path
           d="m 152.381,211.354 19.588,-11.341 c 5.157,8.421 11.859,14.607 23.715,14.607 9.969,0 16.325,-4.984 16.325,-11.858 0,-8.248 -6.53,-11.17 -17.528,-15.98 l -6.013,-2.579 c -17.357,-7.388 -28.871,-16.668 -28.871,-36.258 0,-18.044 13.748,-31.792 35.229,-31.792 15.294,0 26.292,5.328 34.196,19.247 l -18.731,12.029 c -4.125,-7.389 -8.591,-10.31 -15.465,-10.31 -7.046,0 -11.514,4.468 -11.514,10.31 0,7.217 4.468,10.139 14.778,14.608 l 6.014,2.577 c 20.449,8.765 31.963,17.699 31.963,37.804 0,21.654 -17.012,33.51 -39.867,33.51 -22.339,0 -36.774,-10.654 -43.819,-24.574"
           fill="#323330"
           id="path2" /></svg></g>
     <g
       transform="matrix(0.17053925,0,0,0.17053925,-120.04083,207.35391)"
       id="g5"
       style="opacity:0;fill:none;animation: 0.3s 0.1s jump1 cubic-bezier(0.23, 0.21, 0.54, 1.74) forwards"><svg
         width="256"
         height="256"
         fill="none"
         viewBox="0 0 256 256"
         version="1.1"
         id="svg5"><rect
           width="256"
           height="256"
           fill="#e14e1d"
           rx="60"
           id="rect2"
           x="0"
           y="0" /><path
           fill="#ffffff"
           d="m 48,38 8.6098,96.593 H 167.32 l -3.715,41.43 -35.646,9.638 -35.579,-9.624 -2.3788,-26.602 H 57.9389 l 4.5847,51.281 65.4274,18.172 65.51,-18.172 8.783,-98.061 H 85.8241 L 82.901,69.9448 h 122.14 0.098 L 208,38 Z"
           id="path3" /><path
           fill="#ebebeb"
           d="M 128,38 H 48 l 8.6098,96.593 H 128 V 102.655 H 85.8241 L 82.901,69.9448 H 128 Z"
           id="path4" /><path
           fill="#ebebeb"
           d="m 128,185.647 -0.041,0.014 -35.579,-9.624 -2.3788,-26.602 H 57.9388 l 4.5848,51.281 65.4274,18.172 0.049,-0.014 z"
           id="path5" /></svg></g>
     <g
       transform="matrix(0.17053925,0,0,0.17053925,-68.87906,207.35391)"
       id="g9"
       style="opacity:0;fill:none;animation: 0.3s 0.2s jump2 cubic-bezier(0.23, 0.21, 0.54, 1.74) forwards"><svg
         width="256"
         height="256"
         viewBox="0 0 256 256"
         fill="none"
         version="1.1"
         id="svg9"><rect
           width="256"
           height="256"
           rx="60"
           fill="#0277bd"
           id="rect5"
           x="0"
           y="0" /><path
           d="m 53.7527,102.651 2.8628,31.942 h 71.4805 v -31.942 z"
           fill="#ebebeb"
           id="path6" /><path
           d="M 128.095,38 H 127.985 48 l 2.9036,31.9423 h 77.1914 z"
           fill="#ebebeb"
           id="path7" /><path
           d="m 128.095,218.841 v -33.233 l -0.14,0.037 -35.5737,-9.605 -2.2741,-25.476 H 72.821 58.0425 l 4.475,50.154 65.4305,18.164 z"
           fill="#ebebeb"
           id="path8" /><path
           d="m 167.318,134.593 -3.708,41.426 -35.625,9.616 v 33.231 l 65.483,-18.148 0.48,-5.397 7.506,-84.092 0.779,-8.578 L 208,38 h -80.015 v 31.9423 h 45.009 l -2.906,32.7087 h -42.103 v 31.942 z"
           fill="#ffffff"
           id="path9" /></svg></g></g></svg>