mastodon icon logo
mastodon-icon from SVG Logos by Gil Barbara · Color · CC0-1.0 Free for personal and commercial use.
- Name
- mastodon-icon
- Set
- SVG Logos
- Style
- Color
- Viewbox
- 256×274
- License
- CC0
Use the mastodon icon logo
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 274"><path fill="#3088d4" d="M249.874 164.085c-3.753 19.307-33.613 40.438-67.908 44.533c-17.883 2.134-35.49 4.095-54.266 3.234c-30.705-1.407-54.933-7.33-54.933-7.33c0 2.99.184 5.836.553 8.498c3.992 30.302 30.047 32.118 54.728 32.964c24.912.852 47.094-6.142 47.094-6.142l1.023 22.521s-17.425 9.357-48.465 11.078c-17.116.94-38.369-.43-63.122-6.983c-53.686-14.21-62.92-71.436-64.332-129.502c-.43-17.24-.165-33.497-.165-47.094c0-59.375 38.903-76.779 38.903-76.779C58.6 4.074 92.259.286 127.25 0h.86c34.991.286 68.673 4.074 88.287 13.083c0 0 38.901 17.404 38.901 76.78c0 0 .488 43.807-5.425 74.222"/><path fill="#fff" d="M209.413 94.469v71.894H180.93V96.582c0-14.71-6.19-22.176-18.57-22.176c-13.687 0-20.547 8.857-20.547 26.37v38.195h-28.315v-38.195c0-17.513-6.862-26.37-20.55-26.37c-12.379 0-18.568 7.466-18.568 22.176v69.78H45.897V94.47c0-14.694 3.741-26.37 11.256-35.009c7.75-8.638 17.898-13.066 30.496-13.066c14.575 0 25.613 5.602 32.911 16.808l7.095 11.893l7.096-11.893c7.296-11.206 18.334-16.808 32.911-16.808c12.597 0 22.745 4.428 30.496 13.066c7.513 8.639 11.255 20.315 11.255 35.009"/></svg>
React
import type { SVGProps } from "react";
export function LogosMastodonIcon(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 274"><path fill="#3088d4" d="M249.874 164.085c-3.753 19.307-33.613 40.438-67.908 44.533c-17.883 2.134-35.49 4.095-54.266 3.234c-30.705-1.407-54.933-7.33-54.933-7.33c0 2.99.184 5.836.553 8.498c3.992 30.302 30.047 32.118 54.728 32.964c24.912.852 47.094-6.142 47.094-6.142l1.023 22.521s-17.425 9.357-48.465 11.078c-17.116.94-38.369-.43-63.122-6.983c-53.686-14.21-62.92-71.436-64.332-129.502c-.43-17.24-.165-33.497-.165-47.094c0-59.375 38.903-76.779 38.903-76.779C58.6 4.074 92.259.286 127.25 0h.86c34.991.286 68.673 4.074 88.287 13.083c0 0 38.901 17.404 38.901 76.78c0 0 .488 43.807-5.425 74.222"/><path fill="#fff" d="M209.413 94.469v71.894H180.93V96.582c0-14.71-6.19-22.176-18.57-22.176c-13.687 0-20.547 8.857-20.547 26.37v38.195h-28.315v-38.195c0-17.513-6.862-26.37-20.55-26.37c-12.379 0-18.568 7.466-18.568 22.176v69.78H45.897V94.47c0-14.694 3.741-26.37 11.256-35.009c7.75-8.638 17.898-13.066 30.496-13.066c14.575 0 25.613 5.602 32.911 16.808l7.095 11.893l7.096-11.893c7.296-11.206 18.334-16.808 32.911-16.808c12.597 0 22.745 4.428 30.496 13.066c7.513 8.639 11.255 20.315 11.255 35.009"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 274"><path fill="#3088d4" d="M249.874 164.085c-3.753 19.307-33.613 40.438-67.908 44.533c-17.883 2.134-35.49 4.095-54.266 3.234c-30.705-1.407-54.933-7.33-54.933-7.33c0 2.99.184 5.836.553 8.498c3.992 30.302 30.047 32.118 54.728 32.964c24.912.852 47.094-6.142 47.094-6.142l1.023 22.521s-17.425 9.357-48.465 11.078c-17.116.94-38.369-.43-63.122-6.983c-53.686-14.21-62.92-71.436-64.332-129.502c-.43-17.24-.165-33.497-.165-47.094c0-59.375 38.903-76.779 38.903-76.779C58.6 4.074 92.259.286 127.25 0h.86c34.991.286 68.673 4.074 88.287 13.083c0 0 38.901 17.404 38.901 76.78c0 0 .488 43.807-5.425 74.222"/><path fill="#fff" d="M209.413 94.469v71.894H180.93V96.582c0-14.71-6.19-22.176-18.57-22.176c-13.687 0-20.547 8.857-20.547 26.37v38.195h-28.315v-38.195c0-17.513-6.862-26.37-20.55-26.37c-12.379 0-18.568 7.466-18.568 22.176v69.78H45.897V94.47c0-14.694 3.741-26.37 11.256-35.009c7.75-8.638 17.898-13.066 30.496-13.066c14.575 0 25.613 5.602 32.911 16.808l7.095 11.893l7.096-11.893c7.296-11.206 18.334-16.808 32.911-16.808c12.597 0 22.745 4.428 30.496 13.066c7.513 8.639 11.255 20.315 11.255 35.009"/></svg> </template>
CSS
.icon-mastodon-icon {
width: 24px;
height: 24px;
background-color: currentColor;
-webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%20256%20274%22%3E%3Cpath%20fill%3D%22%233088d4%22%20d%3D%22M249.874%20164.085c-3.753%2019.307-33.613%2040.438-67.908%2044.533c-17.883%202.134-35.49%204.095-54.266%203.234c-30.705-1.407-54.933-7.33-54.933-7.33c0%202.99.184%205.836.553%208.498c3.992%2030.302%2030.047%2032.118%2054.728%2032.964c24.912.852%2047.094-6.142%2047.094-6.142l1.023%2022.521s-17.425%209.357-48.465%2011.078c-17.116.94-38.369-.43-63.122-6.983c-53.686-14.21-62.92-71.436-64.332-129.502c-.43-17.24-.165-33.497-.165-47.094c0-59.375%2038.903-76.779%2038.903-76.779C58.6%204.074%2092.259.286%20127.25%200h.86c34.991.286%2068.673%204.074%2088.287%2013.083c0%200%2038.901%2017.404%2038.901%2076.78c0%200%20.488%2043.807-5.425%2074.222%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M209.413%2094.469v71.894H180.93V96.582c0-14.71-6.19-22.176-18.57-22.176c-13.687%200-20.547%208.857-20.547%2026.37v38.195h-28.315v-38.195c0-17.513-6.862-26.37-20.55-26.37c-12.379%200-18.568%207.466-18.568%2022.176v69.78H45.897V94.47c0-14.694%203.741-26.37%2011.256-35.009c7.75-8.638%2017.898-13.066%2030.496-13.066c14.575%200%2025.613%205.602%2032.911%2016.808l7.095%2011.893l7.096-11.893c7.296-11.206%2018.334-16.808%2032.911-16.808c12.597%200%2022.745%204.428%2030.496%2013.066c7.513%208.639%2011.255%2020.315%2011.255%2035.009%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%20256%20274%22%3E%3Cpath%20fill%3D%22%233088d4%22%20d%3D%22M249.874%20164.085c-3.753%2019.307-33.613%2040.438-67.908%2044.533c-17.883%202.134-35.49%204.095-54.266%203.234c-30.705-1.407-54.933-7.33-54.933-7.33c0%202.99.184%205.836.553%208.498c3.992%2030.302%2030.047%2032.118%2054.728%2032.964c24.912.852%2047.094-6.142%2047.094-6.142l1.023%2022.521s-17.425%209.357-48.465%2011.078c-17.116.94-38.369-.43-63.122-6.983c-53.686-14.21-62.92-71.436-64.332-129.502c-.43-17.24-.165-33.497-.165-47.094c0-59.375%2038.903-76.779%2038.903-76.779C58.6%204.074%2092.259.286%20127.25%200h.86c34.991.286%2068.673%204.074%2088.287%2013.083c0%200%2038.901%2017.404%2038.901%2076.78c0%200%20.488%2043.807-5.425%2074.222%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M209.413%2094.469v71.894H180.93V96.582c0-14.71-6.19-22.176-18.57-22.176c-13.687%200-20.547%208.857-20.547%2026.37v38.195h-28.315v-38.195c0-17.513-6.862-26.37-20.55-26.37c-12.379%200-18.568%207.466-18.568%2022.176v69.78H45.897V94.47c0-14.694%203.741-26.37%2011.256-35.009c7.75-8.638%2017.898-13.066%2030.496-13.066c14.575%200%2025.613%205.602%2032.911%2016.808l7.095%2011.893l7.096-11.893c7.296-11.206%2018.334-16.808%2032.911-16.808c12.597%200%2022.745%204.428%2030.496%2013.066c7.513%208.639%2011.255%2020.315%2011.255%2035.009%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/logos/mastodon-icon.svg?color=%231a73e8&size=48
