Adding icons (red peertube video alternative, hero)

It is often important to communicate that one is on a social platform from one's own website. Currently, users of the fediverse network are left with two choices; either use an incorrect/inaccurate icon based on specific fediverse software, or a gaudy icon with negative connotations (of witchcraft). Most choose the former. This has the ill-effect of elevating one implementation of Fediverse software, and creates a false impression of fediverse's network topology.

Since Feb 2021 DSFGS has been working on a Fediverse icon and this is the result of much feedback, review and iteration. 

This icon pack, the author calls "#fediOrigami", is developed based on an origami boat turned on its side. The overlapping, semi-transparent "folds" are their own entities, but interact with each other to form an 'F' and also create a silhouette of part of a star. A star being an homage to the previous but seldom-used icon design which was a connected five pointed star.

(NOTE: Icons are Plain SVG but have yet to be properly optimised. The Scour (v0.31) export feature in Inkscape is broken. That project is hosted on MicrosoftGH (https://github.com/scour-project/scour) and the author was disinterested in contacting a Microsoft user.

# If you are looking for a mastodon icon for your website, you probably want to use a fediverse icon instead.

Fediverse was growing in popularity long before Mastodon.
This commit is contained in:
joseph 2023-03-06 11:38:57 +00:00
parent 414bc6f237
commit e2b1548c25
5 changed files with 322 additions and 0 deletions

View File

@ -0,0 +1,48 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
width="18.0px"
height="18.0px"
viewBox="0 0 18.0 18.0"
version="1.1"
id="SVGRoot"
xmlns:xlink="http://www.w3.org/1999/xlink"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<defs
id="defs4956">
<linearGradient
xlink:href="#linearGradient10651"
id="linearGradient1700"
gradientUnits="userSpaceOnUse"
gradientTransform="matrix(1.2511872,0,0,1.2511872,-2.7578092,-1.1240182)"
x1="1.3894912"
y1="22.344736"
x2="15.531096"
y2="7.7256188" />
<linearGradient
id="linearGradient10651">
<stop
style="stop-color:#8cc4f1;stop-opacity:1"
offset="0"
id="stop10647" />
<stop
style="stop-color:#8938c7;stop-opacity:1"
offset="1"
id="stop10649" />
</linearGradient>
</defs>
<g
id="g67298"
transform="matrix(1.2512007,0,0,1.2512007,-126.76231,-1.8999438)">
<path
id="path33061-2-2-7-63-9-6-6-1-7-3-6-6-5-5-0-7-0-0-1"
style="display:inline;mix-blend-mode:normal;fill:#ff3c2c;fill-opacity:1;stroke:none;stroke-width:0.999999px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
d="m 107.82082,2.775823 0.0786,1.235301 2.68165,2.123048 3.13478,-1.80274 c 0.36888,-0.212221 0.71959,-0.768099 0.59373,-1.412108 -0.12095,-0.61943 -0.68531,-1.000312 -1.18749,-1.04296 l -4.13893,-0.352139 c -0.81528,-0.06939 -1.21016,0.500179 -1.16235,1.251591 z m 2.76026,3.358349 -2.459,1.414061 0.20108,3.187498 3.99998,-0.203111 c 1.21985,-0.0621 1.80896,-1.590308 0.79688,-2.390631 z m -2.25781,4.601559 -4.24804,0.216794 c -0.419,0.02117 -0.79158,-0.176995 -1.03907,-0.478518 -0.44889,0.259162 -0.45581,0.850839 -0.14702,1.201617 l 3.40089,3.862833 c 0.59086,0.670968 2.36501,0.458948 2.27539,-0.96093 z" />
<path
id="path33061-2-2-7-63-2-5-3-6-4-7-6-1-3-3-5"
style="display:inline;mix-blend-mode:normal;fill:#00eaff;fill-opacity:1;stroke:none;stroke-width:0.999999px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
d="m 105.51466,2.52089 c -0.4992,0.0076 -0.99658,0.263698 -1.1289,0.755861 l -1.62108,6.025387 c -0.11225,0.417861 0.0113,0.853255 0.27137,1.171876 l 5.08592,-2.925781 -0.22261,-3.537109 -1.5625,-1.234375 C 106.115,2.60119 105.81412,2.516264 105.51459,2.520875 Z" />
</g>
</svg>

After

Width:  |  Height:  |  Size: 2.4 KiB

View File

@ -0,0 +1,48 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
width="22.0px"
height="22.0px"
viewBox="0 0 22.0 22.0"
version="1.1"
id="SVGRoot"
xmlns:xlink="http://www.w3.org/1999/xlink"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<defs
id="defs6040">
<linearGradient
xlink:href="#linearGradient10651"
id="linearGradient1700"
gradientUnits="userSpaceOnUse"
gradientTransform="matrix(1.5292946,0,0,1.5292946,-3.3712755,-1.3738592)"
x1="1.3894912"
y1="22.344736"
x2="15.531096"
y2="7.7256188" />
<linearGradient
id="linearGradient10651">
<stop
style="stop-color:#8cc4f1;stop-opacity:1"
offset="0"
id="stop10647" />
<stop
style="stop-color:#8938c7;stop-opacity:1"
offset="1"
id="stop10649" />
</linearGradient>
</defs>
<g
id="g67298"
transform="matrix(1.5292453,0,0,1.5292453,-154.93172,-2.3221537)">
<path
id="path33061-2-2-7-63-9-6-6-1-7-3-6-6-5-5-0-7-0-0-1"
style="display:inline;mix-blend-mode:normal;fill:#ff3c2c;fill-opacity:1;stroke:none;stroke-width:0.999999px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
d="m 107.82082,2.775823 0.0786,1.235301 2.68165,2.123048 3.13478,-1.80274 c 0.36888,-0.212221 0.71959,-0.768099 0.59373,-1.412108 -0.12095,-0.61943 -0.68531,-1.000312 -1.18749,-1.04296 l -4.13893,-0.352139 c -0.81528,-0.06939 -1.21016,0.500179 -1.16235,1.251591 z m 2.76026,3.358349 -2.459,1.414061 0.20108,3.187498 3.99998,-0.203111 c 1.21985,-0.0621 1.80896,-1.590308 0.79688,-2.390631 z m -2.25781,4.601559 -4.24804,0.216794 c -0.419,0.02117 -0.79158,-0.176995 -1.03907,-0.478518 -0.44889,0.259162 -0.45581,0.850839 -0.14702,1.201617 l 3.40089,3.862833 c 0.59086,0.670968 2.36501,0.458948 2.27539,-0.96093 z" />
<path
id="path33061-2-2-7-63-2-5-3-6-4-7-6-1-3-3-5"
style="display:inline;mix-blend-mode:normal;fill:#00eaff;fill-opacity:1;stroke:none;stroke-width:0.999999px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
d="m 105.51466,2.52089 c -0.4992,0.0076 -0.99658,0.263698 -1.1289,0.755861 l -1.62108,6.025387 c -0.11225,0.417861 0.0113,0.853255 0.27137,1.171876 l 5.08592,-2.925781 -0.22261,-3.537109 -1.5625,-1.234375 C 106.115,2.60119 105.81412,2.516264 105.51459,2.520875 Z" />
</g>
</svg>

After

Width:  |  Height:  |  Size: 2.4 KiB

View File

@ -0,0 +1,48 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
width="24.0px"
height="24.0px"
viewBox="0 0 24.0 24.0"
version="1.1"
id="SVGRoot"
xmlns:xlink="http://www.w3.org/1999/xlink"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<defs
id="defs6220">
<linearGradient
xlink:href="#linearGradient10651"
id="linearGradient1700"
gradientUnits="userSpaceOnUse"
gradientTransform="matrix(1.6682679,0,0,1.6682679,-3.6772514,-1.4987075)"
x1="1.3894912"
y1="22.344736"
x2="15.531096"
y2="7.7256188" />
<linearGradient
id="linearGradient10651">
<stop
style="stop-color:#8cc4f1;stop-opacity:1"
offset="0"
id="stop10647" />
<stop
style="stop-color:#8938c7;stop-opacity:1"
offset="1"
id="stop10649" />
</linearGradient>
</defs>
<g
id="g67298"
transform="matrix(1.6682677,0,0,1.6682677,-169.01643,-2.5332585)">
<path
id="path33061-2-2-7-63-9-6-6-1-7-3-6-6-5-5-0-7-0-0-1"
style="display:inline;mix-blend-mode:normal;fill:#ff3c2c;fill-opacity:1;stroke:none;stroke-width:0.999999px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
d="m 107.82082,2.775823 0.0786,1.235301 2.68165,2.123048 3.13478,-1.80274 c 0.36888,-0.212221 0.71959,-0.768099 0.59373,-1.412108 -0.12095,-0.61943 -0.68531,-1.000312 -1.18749,-1.04296 l -4.13893,-0.352139 c -0.81528,-0.06939 -1.21016,0.500179 -1.16235,1.251591 z m 2.76026,3.358349 -2.459,1.414061 0.20108,3.187498 3.99998,-0.203111 c 1.21985,-0.0621 1.80896,-1.590308 0.79688,-2.390631 z m -2.25781,4.601559 -4.24804,0.216794 c -0.419,0.02117 -0.79158,-0.176995 -1.03907,-0.478518 -0.44889,0.259162 -0.45581,0.850839 -0.14702,1.201617 l 3.40089,3.862833 c 0.59086,0.670968 2.36501,0.458948 2.27539,-0.96093 z" />
<path
id="path33061-2-2-7-63-2-5-3-6-4-7-6-1-3-3-5"
style="display:inline;mix-blend-mode:normal;fill:#00eaff;fill-opacity:1;stroke:none;stroke-width:0.999999px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
d="m 105.51466,2.52089 c -0.4992,0.0076 -0.99658,0.263698 -1.1289,0.755861 l -1.62108,6.025387 c -0.11225,0.417861 0.0113,0.853255 0.27137,1.171876 l 5.08592,-2.925781 -0.22261,-3.537109 -1.5625,-1.234375 C 106.115,2.60119 105.81412,2.516264 105.51459,2.520875 Z" />
</g>
</svg>

After

Width:  |  Height:  |  Size: 2.4 KiB

View File

@ -0,0 +1,48 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
width="28.0px"
height="28.0px"
viewBox="0 0 28.0 28.0"
version="1.1"
id="SVGRoot"
xmlns:xlink="http://www.w3.org/1999/xlink"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<defs
id="defs6561">
<linearGradient
xlink:href="#linearGradient10651"
id="linearGradient1700"
gradientUnits="userSpaceOnUse"
gradientTransform="matrix(1.9463126,0,0,1.9463126,-4.2901269,-1.7484921)"
x1="1.3894912"
y1="22.344736"
x2="15.531096"
y2="7.7256188" />
<linearGradient
id="linearGradient10651">
<stop
style="stop-color:#8cc4f1;stop-opacity:1"
offset="0"
id="stop10647" />
<stop
style="stop-color:#8938c7;stop-opacity:1"
offset="1"
id="stop10649" />
</linearGradient>
</defs>
<g
id="g67298"
transform="matrix(1.9463127,0,0,1.9463127,-197.18588,-2.9554718)">
<path
id="path33061-2-2-7-63-9-6-6-1-7-3-6-6-5-5-0-7-0-0-1"
style="display:inline;mix-blend-mode:normal;fill:#ff3c2c;fill-opacity:1;stroke:none;stroke-width:0.999999px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
d="m 107.82082,2.775823 0.0786,1.235301 2.68165,2.123048 3.13478,-1.80274 c 0.36888,-0.212221 0.71959,-0.768099 0.59373,-1.412108 -0.12095,-0.61943 -0.68531,-1.000312 -1.18749,-1.04296 l -4.13893,-0.352139 c -0.81528,-0.06939 -1.21016,0.500179 -1.16235,1.251591 z m 2.76026,3.358349 -2.459,1.414061 0.20108,3.187498 3.99998,-0.203111 c 1.21985,-0.0621 1.80896,-1.590308 0.79688,-2.390631 z m -2.25781,4.601559 -4.24804,0.216794 c -0.419,0.02117 -0.79158,-0.176995 -1.03907,-0.478518 -0.44889,0.259162 -0.45581,0.850839 -0.14702,1.201617 l 3.40089,3.862833 c 0.59086,0.670968 2.36501,0.458948 2.27539,-0.96093 z" />
<path
id="path33061-2-2-7-63-2-5-3-6-4-7-6-1-3-3-5"
style="display:inline;mix-blend-mode:normal;fill:#00eaff;fill-opacity:1;stroke:none;stroke-width:0.999999px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
d="m 105.51466,2.52089 c -0.4992,0.0076 -0.99658,0.263698 -1.1289,0.755861 l -1.62108,6.025387 c -0.11225,0.417861 0.0113,0.853255 0.27137,1.171876 l 5.08592,-2.925781 -0.22261,-3.537109 -1.5625,-1.234375 C 106.115,2.60119 105.81412,2.516264 105.51459,2.520875 Z" />
</g>
</svg>

After

Width:  |  Height:  |  Size: 2.4 KiB

View File

@ -0,0 +1,130 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
width="48.0px"
height="48.0px"
viewBox="0 0 48.0 48.0"
version="1.1"
id="SVGRoot"
xmlns:xlink="http://www.w3.org/1999/xlink"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<defs
id="defs58437">
<pattern
patternUnits="userSpaceOnUse"
width="1.898437"
height="1.89843"
patternTransform="translate(84.308594,221.91016)"
id="pattern20533-9-3">
<path
id="path18889-9-3-1"
style="color:#000000;fill:#000000;-inkscape-stroke:none"
d="M 0,0 V 0.23437 L 1.664062,1.89843 H 1.898437 V 1.66211 L 0.236328,0 Z M 1.652344,0 1.898437,0.24609 V 0 Z M 0,1.65039 v 0.24804 h 0.248047 z" />
</pattern>
<linearGradient
xlink:href="#linearGradient30113"
id="linearGradient70162"
gradientUnits="userSpaceOnUse"
gradientTransform="matrix(3.1453372,0,0,3.1453372,-2.2961119,-0.06308922)"
x1="3.0632455"
y1="11.561657"
x2="9.9407597"
y2="3.313194" />
<linearGradient
id="linearGradient30113">
<stop
style="stop-color:#38c76e;stop-opacity:1"
offset="0"
id="stop30111" />
<stop
style="stop-color:#4153d4;stop-opacity:1"
offset="1"
id="stop30109" />
</linearGradient>
<linearGradient
xlink:href="#linearGradient124266"
id="linearGradient70164"
gradientUnits="userSpaceOnUse"
gradientTransform="matrix(3.1453372,0,0,3.1453372,-2.0012366,-0.35796458)"
x1="5.6339183"
y1="10.068818"
x2="15.868264"
y2="7.5873222" />
<linearGradient
id="linearGradient124266">
<stop
style="stop-color:#ff8d4e;stop-opacity:1"
offset="0"
id="stop124262" />
<stop
style="stop-color:#ff6566;stop-opacity:1"
offset="1"
id="stop124264" />
</linearGradient>
<linearGradient
xlink:href="#linearGradient35392"
id="linearGradient70166"
gradientUnits="userSpaceOnUse"
gradientTransform="matrix(3.1453372,0,0,3.1453372,-2.0012366,-0.35796458)"
x1="5.6176314"
y1="14.049754"
x2="7.8836904"
y2="1.5791854" />
<linearGradient
id="linearGradient35392">
<stop
style="stop-color:#feff5f;stop-opacity:1"
offset="0"
id="stop35388" />
<stop
style="stop-color:#ffe38e;stop-opacity:1"
offset="1"
id="stop35390" />
</linearGradient>
<linearGradient
xlink:href="#linearGradient123804"
id="linearGradient70168"
gradientUnits="userSpaceOnUse"
gradientTransform="matrix(3.1453372,0,0,3.1453372,-2.2977789,-0.07503521)"
x1="7.2182817"
y1="9.6813412"
x2="17.894133"
y2="4.7827544" />
<linearGradient
id="linearGradient123804">
<stop
style="stop-color:#96cffe;stop-opacity:1"
offset="0"
id="stop123800" />
<stop
style="stop-color:#a22afd;stop-opacity:1"
offset="1"
id="stop123802" />
</linearGradient>
</defs>
<g
id="layer1">
<path
id="path33061-2-2-7-63-1-4-9"
style="display:inline;mix-blend-mode:multiply;fill:url(#linearGradient70162);fill-opacity:1;stroke:none;stroke-width:3.14534px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
d="M 6.6794915,31.962725 2.4898017,27.201716 c -0.2064599,1.306167 0.3781136,2.659628 1.4129452,3.667513 0.7280009,0.709041 1.7643801,1.080675 2.7767446,1.093496 z M 6.3416131,15.812157 17.006272,1.8731521 c 0.01195,-0.015412 0.02485,-0.027679 0.03686,-0.042997 L 14.591984,1.6212735 C 13.033551,1.4888862 10.967992,2.3155657 10.224142,4.484021 Z" />
<path
id="path33061-2-2-7-63-2-5-3"
style="display:inline;mix-blend-mode:multiply;fill:#6783ad;fill-opacity:1;stroke:none;stroke-width:3.14534px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
d="M 17.854038,5.915401 C 16.283833,5.93962 14.71943,6.7448831 14.303248,8.2928356 L 9.2043606,27.244719 c -0.353366,1.314314 0.031453,2.683768 0.8539084,3.685942 L 26.05526,21.728093 25.354932,10.602693 20.440342,6.720167 C 19.742112,6.1680251 18.796164,5.9008633 17.854038,5.915401 Z" />
<path
style="display:inline;mix-blend-mode:multiply;fill:url(#linearGradient70164);fill-opacity:1;stroke:none;stroke-width:0.330352;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
d="M 14.735301,7.3759887 C 15.401194,4.8992684 19.009446,4.3325919 20.871392,5.8049651 L 42.20957,22.678595 c 3.18332,2.51728 1.327924,7.324059 -2.508856,7.519382 L 13.759136,31.518594 C 11.048686,31.65658 8.9510383,28.889972 9.6388198,26.331841 Z"
id="path7252-2-8-4-0-1-3-7" />
<path
style="display:inline;mix-blend-mode:soft-light;fill:url(#linearGradient70166);fill-opacity:1;stroke:none;stroke-width:3.14534px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
d="M 25.73202,3.8382172 C 25.486841,-0.04559485 20.497222,-1.3114264 18.283685,1.5808338 L 3.4596507,20.95028 c -1.3555743,1.771224 -1.4462638,3.96258 -0.046551,5.552017 L 21.079346,46.562965 c 1.858513,2.110408 7.441106,1.444927 7.159165,-3.021087 z"
id="path25940-9-9-8-2-6-0-4" />
<path
id="path33061-2-2-7-63-9-6-1-2-6-1-0-6-8-6"
style="display:inline;mix-blend-mode:multiply;fill:url(#linearGradient70168);fill-opacity:1;stroke:none;stroke-width:3.14534px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
d="m 24.4502,2.4018109 c 0.272701,0.4968972 0.45035,1.0686063 0.491459,1.7201063 l 0.411599,6.4688298 8.434662,6.677698 9.859909,-5.670209 c 1.160724,-0.667592 2.263448,-2.4159431 1.867544,-4.4415591 -0.380806,-1.9483225 -2.1555,-3.1463217 -3.735088,-3.2804892 z m 9.33772,14.8666341 -7.734321,4.447702 0.632747,10.025763 12.581349,-0.638897 c 3.836777,-0.195325 5.689758,-5.002042 2.506457,-7.519322 z M 26.686346,31.74191 13.324797,32.42381 C 12.006932,32.4909 10.83501,31.867139 10.056602,30.918716 L 9.0613862,31.490038 C 8.5057309,31.809635 7.8440463,31.957252 7.175442,31.950779 l 13.115805,14.897349 c 1.858517,2.110408 7.438785,1.443543 7.156869,-3.022471 z" />
</g>
</svg>

After

Width:  |  Height:  |  Size: 6.2 KiB