Shouldn’t have but I did, peeked at the SVG-innards of the “SAFE Network Mark” on the MaidSafe Assets-page. In there the jumble of coordinates making up the new Safe logo:
Scalable Vector Graphics
Scalable Vector Graphics (SVG) is an XML-based vector image format for two-dimensional graphics with support for interactivity and animation.
SVG images and their behaviors are defined in XML text files. As XML files, SVG images can be created and edited with any text editor, but are more often created with drawing software.
Indeed, the XML looks like the export of a detailed drawing but now I wanted to know if it was feasible to do this the other way round, constructing the logo in a text editor.
Would I’ve posted if it was not? Here it is:
<svg>
<g stroke="#5b91cc" stroke-width="1.2"
stroke-linecap="round" stroke-dasharray="0,2">
<path d="m0,0v4m1.74-5v6m1.74-7v8m1.74-7v6m1.74-5v4" />
</g>
<g stroke="#5b91cc" stroke-width="0.55" stroke-linecap="round">
<path d="m0,2v-2m1.74-1v4m1.74-1v4m0-8v2" />
<path d="M0,0L3.48,2m3.48,2l-1.74-1m0,0l-3.48,2m1.74,1l1.74-1" />
<path d="M0,4l1.74-1m1.74-1l3.48-2m0,0l-1.74-1M3.48,0l3.48,2" />
</g>
</svg>
Compared to the original a 65.000 to 500 ratio in text (characters) and seemingly the same logo:
New to the SVG-format and not saying it would be poor taste or not but try following up with this:
<circle cx="0" cy="4" r=".3" style="fill: #f00">
<animate attributeName="fill"
dur="0.8s"
values="#800;#f00;#800;#800"
repeatCount="indefinite"/>
</circle>
An animated red dot on one of the outer edges. Could be a sign it’s charging overnight or a tail light indicating an intended left turn at the next intersection …