mastodon-fill from Akar Icons by Arturo Wibawa · Fill · MIT Free for personal and commercial use.

Name
mastodon-fill
Set
Akar Icons
Style
Fill
Viewbox
24×24
License
MIT

The same icon in other sets

Use the mastodon icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M12.158 0c-3.068.025-6.02.357-7.74 1.147c0 0-3.41 1.526-3.41 6.733c0 1.192-.024 2.617.014 4.129c.123 5.092.933 10.11 5.64 11.355c2.171.575 4.035.695 5.535.613c2.722-.151 4.25-.972 4.25-.972l-.09-1.974s-1.945.613-4.13.538c-2.163-.074-4.448-.233-4.798-2.89a5.5 5.5 0 0 1-.048-.745s2.124.519 4.816.642c1.647.076 3.19-.096 4.759-.283c3.007-.36 5.625-2.212 5.954-3.905c.519-2.667.476-6.508.476-6.508c0-5.207-3.411-6.733-3.411-6.733C18.255.357 15.302.025 12.233 0zM8.686 4.068c1.278 0 2.245.491 2.885 1.474l.622 1.043l.623-1.043c.64-.983 1.607-1.474 2.885-1.474c1.105 0 1.995.388 2.675 1.146q.987 1.136.986 3.07v6.303h-2.497V8.47c0-1.29-.543-1.945-1.628-1.945c-1.2 0-1.802.777-1.802 2.313v3.349h-2.483v-3.35c0-1.535-.601-2.312-1.802-2.312c-1.085 0-1.628.655-1.628 1.945v6.118H5.024V8.283q0-1.932.987-3.07c.68-.757 1.57-1.145 2.675-1.145"/></svg>

React

import type { SVGProps } from "react";

export function AkarIconsMastodonFill(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M12.158 0c-3.068.025-6.02.357-7.74 1.147c0 0-3.41 1.526-3.41 6.733c0 1.192-.024 2.617.014 4.129c.123 5.092.933 10.11 5.64 11.355c2.171.575 4.035.695 5.535.613c2.722-.151 4.25-.972 4.25-.972l-.09-1.974s-1.945.613-4.13.538c-2.163-.074-4.448-.233-4.798-2.89a5.5 5.5 0 0 1-.048-.745s2.124.519 4.816.642c1.647.076 3.19-.096 4.759-.283c3.007-.36 5.625-2.212 5.954-3.905c.519-2.667.476-6.508.476-6.508c0-5.207-3.411-6.733-3.411-6.733C18.255.357 15.302.025 12.233 0zM8.686 4.068c1.278 0 2.245.491 2.885 1.474l.622 1.043l.623-1.043c.64-.983 1.607-1.474 2.885-1.474c1.105 0 1.995.388 2.675 1.146q.987 1.136.986 3.07v6.303h-2.497V8.47c0-1.29-.543-1.945-1.628-1.945c-1.2 0-1.802.777-1.802 2.313v3.349h-2.483v-3.35c0-1.535-.601-2.312-1.802-2.312c-1.085 0-1.628.655-1.628 1.945v6.118H5.024V8.283q0-1.932.987-3.07c.68-.757 1.57-1.145 2.675-1.145"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M12.158 0c-3.068.025-6.02.357-7.74 1.147c0 0-3.41 1.526-3.41 6.733c0 1.192-.024 2.617.014 4.129c.123 5.092.933 10.11 5.64 11.355c2.171.575 4.035.695 5.535.613c2.722-.151 4.25-.972 4.25-.972l-.09-1.974s-1.945.613-4.13.538c-2.163-.074-4.448-.233-4.798-2.89a5.5 5.5 0 0 1-.048-.745s2.124.519 4.816.642c1.647.076 3.19-.096 4.759-.283c3.007-.36 5.625-2.212 5.954-3.905c.519-2.667.476-6.508.476-6.508c0-5.207-3.411-6.733-3.411-6.733C18.255.357 15.302.025 12.233 0zM8.686 4.068c1.278 0 2.245.491 2.885 1.474l.622 1.043l.623-1.043c.64-.983 1.607-1.474 2.885-1.474c1.105 0 1.995.388 2.675 1.146q.987 1.136.986 3.07v6.303h-2.497V8.47c0-1.29-.543-1.945-1.628-1.945c-1.2 0-1.802.777-1.802 2.313v3.349h-2.483v-3.35c0-1.535-.601-2.312-1.802-2.312c-1.085 0-1.628.655-1.628 1.945v6.118H5.024V8.283q0-1.932.987-3.07c.68-.757 1.57-1.145 2.675-1.145"/></svg>
</template>

CSS

.icon-mastodon-fill {
  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%2024%2024%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M12.158%200c-3.068.025-6.02.357-7.74%201.147c0%200-3.41%201.526-3.41%206.733c0%201.192-.024%202.617.014%204.129c.123%205.092.933%2010.11%205.64%2011.355c2.171.575%204.035.695%205.535.613c2.722-.151%204.25-.972%204.25-.972l-.09-1.974s-1.945.613-4.13.538c-2.163-.074-4.448-.233-4.798-2.89a5.5%205.5%200%200%201-.048-.745s2.124.519%204.816.642c1.647.076%203.19-.096%204.759-.283c3.007-.36%205.625-2.212%205.954-3.905c.519-2.667.476-6.508.476-6.508c0-5.207-3.411-6.733-3.411-6.733C18.255.357%2015.302.025%2012.233%200zM8.686%204.068c1.278%200%202.245.491%202.885%201.474l.622%201.043l.623-1.043c.64-.983%201.607-1.474%202.885-1.474c1.105%200%201.995.388%202.675%201.146q.987%201.136.986%203.07v6.303h-2.497V8.47c0-1.29-.543-1.945-1.628-1.945c-1.2%200-1.802.777-1.802%202.313v3.349h-2.483v-3.35c0-1.535-.601-2.312-1.802-2.312c-1.085%200-1.628.655-1.628%201.945v6.118H5.024V8.283q0-1.932.987-3.07c.68-.757%201.57-1.145%202.675-1.145%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%2024%2024%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M12.158%200c-3.068.025-6.02.357-7.74%201.147c0%200-3.41%201.526-3.41%206.733c0%201.192-.024%202.617.014%204.129c.123%205.092.933%2010.11%205.64%2011.355c2.171.575%204.035.695%205.535.613c2.722-.151%204.25-.972%204.25-.972l-.09-1.974s-1.945.613-4.13.538c-2.163-.074-4.448-.233-4.798-2.89a5.5%205.5%200%200%201-.048-.745s2.124.519%204.816.642c1.647.076%203.19-.096%204.759-.283c3.007-.36%205.625-2.212%205.954-3.905c.519-2.667.476-6.508.476-6.508c0-5.207-3.411-6.733-3.411-6.733C18.255.357%2015.302.025%2012.233%200zM8.686%204.068c1.278%200%202.245.491%202.885%201.474l.622%201.043l.623-1.043c.64-.983%201.607-1.474%202.885-1.474c1.105%200%201.995.388%202.675%201.146q.987%201.136.986%203.07v6.303h-2.497V8.47c0-1.29-.543-1.945-1.628-1.945c-1.2%200-1.802.777-1.802%202.313v3.349h-2.483v-3.35c0-1.535-.601-2.312-1.802-2.312c-1.085%200-1.628.655-1.628%201.945v6.118H5.024V8.283q0-1.932.987-3.07c.68-.757%201.57-1.145%202.675-1.145%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/akar-icons/mastodon-fill.svg?color=%231a73e8&size=48