gatsby logo
gatsby from Material Icon Theme by Material Extensions · Color · MIT Free for personal and commercial use.
- Name
- gatsby
- Set
- Material Icon Theme
- Style
- Color
- Viewbox
- 28×28
- License
- MIT
The same logo in other sets
Use the gatsby logo
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 28 28"><path fill="#fafafa" d="M23.835 14h-6.259v1.788h4.292c-.626 2.682-2.593 4.918-5.186 5.812L6.4 11.318c1.073-3.13 4.113-5.365 7.6-5.365c2.682 0 5.096 1.342 6.616 3.398l1.341-1.162C20.17 5.775 17.308 4.165 14 4.165c-4.65 0-8.583 3.308-9.566 7.69l11.801 11.801c4.292-1.073 7.6-5.007 7.6-9.656m-19.67.09c0 2.503.984 4.917 2.861 6.794s4.381 2.861 6.795 2.861z"/><path fill="#6a1b9a" d="M14 1.483C7.116 1.483 1.483 7.116 1.483 14S7.116 26.517 14 26.517S26.517 20.884 26.517 14S20.884 1.483 14 1.483m-6.974 19.49c-1.877-1.877-2.86-4.38-2.86-6.794l9.745 9.656c-2.504-.09-5.007-.984-6.885-2.861zm9.12 2.594L4.433 11.854C5.417 7.474 9.351 4.165 14 4.165c3.308 0 6.17 1.61 7.957 4.024l-1.34 1.162C19.096 7.294 16.681 5.953 14 5.953c-3.487 0-6.437 2.236-7.6 5.365L16.682 21.6c2.593-.894 4.56-3.13 5.186-5.812h-4.292V14h6.259c0 4.65-3.308 8.583-7.69 9.567z"/></svg>
React
import type { SVGProps } from "react";
export function MaterialIconThemeGatsby(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 28 28"><path fill="#fafafa" d="M23.835 14h-6.259v1.788h4.292c-.626 2.682-2.593 4.918-5.186 5.812L6.4 11.318c1.073-3.13 4.113-5.365 7.6-5.365c2.682 0 5.096 1.342 6.616 3.398l1.341-1.162C20.17 5.775 17.308 4.165 14 4.165c-4.65 0-8.583 3.308-9.566 7.69l11.801 11.801c4.292-1.073 7.6-5.007 7.6-9.656m-19.67.09c0 2.503.984 4.917 2.861 6.794s4.381 2.861 6.795 2.861z"/><path fill="#6a1b9a" d="M14 1.483C7.116 1.483 1.483 7.116 1.483 14S7.116 26.517 14 26.517S26.517 20.884 26.517 14S20.884 1.483 14 1.483m-6.974 19.49c-1.877-1.877-2.86-4.38-2.86-6.794l9.745 9.656c-2.504-.09-5.007-.984-6.885-2.861zm9.12 2.594L4.433 11.854C5.417 7.474 9.351 4.165 14 4.165c3.308 0 6.17 1.61 7.957 4.024l-1.34 1.162C19.096 7.294 16.681 5.953 14 5.953c-3.487 0-6.437 2.236-7.6 5.365L16.682 21.6c2.593-.894 4.56-3.13 5.186-5.812h-4.292V14h6.259c0 4.65-3.308 8.583-7.69 9.567z"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 28 28"><path fill="#fafafa" d="M23.835 14h-6.259v1.788h4.292c-.626 2.682-2.593 4.918-5.186 5.812L6.4 11.318c1.073-3.13 4.113-5.365 7.6-5.365c2.682 0 5.096 1.342 6.616 3.398l1.341-1.162C20.17 5.775 17.308 4.165 14 4.165c-4.65 0-8.583 3.308-9.566 7.69l11.801 11.801c4.292-1.073 7.6-5.007 7.6-9.656m-19.67.09c0 2.503.984 4.917 2.861 6.794s4.381 2.861 6.795 2.861z"/><path fill="#6a1b9a" d="M14 1.483C7.116 1.483 1.483 7.116 1.483 14S7.116 26.517 14 26.517S26.517 20.884 26.517 14S20.884 1.483 14 1.483m-6.974 19.49c-1.877-1.877-2.86-4.38-2.86-6.794l9.745 9.656c-2.504-.09-5.007-.984-6.885-2.861zm9.12 2.594L4.433 11.854C5.417 7.474 9.351 4.165 14 4.165c3.308 0 6.17 1.61 7.957 4.024l-1.34 1.162C19.096 7.294 16.681 5.953 14 5.953c-3.487 0-6.437 2.236-7.6 5.365L16.682 21.6c2.593-.894 4.56-3.13 5.186-5.812h-4.292V14h6.259c0 4.65-3.308 8.583-7.69 9.567z"/></svg> </template>
CSS
.icon-gatsby {
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%2028%2028%22%3E%3Cpath%20fill%3D%22%23fafafa%22%20d%3D%22M23.835%2014h-6.259v1.788h4.292c-.626%202.682-2.593%204.918-5.186%205.812L6.4%2011.318c1.073-3.13%204.113-5.365%207.6-5.365c2.682%200%205.096%201.342%206.616%203.398l1.341-1.162C20.17%205.775%2017.308%204.165%2014%204.165c-4.65%200-8.583%203.308-9.566%207.69l11.801%2011.801c4.292-1.073%207.6-5.007%207.6-9.656m-19.67.09c0%202.503.984%204.917%202.861%206.794s4.381%202.861%206.795%202.861z%22%2F%3E%3Cpath%20fill%3D%22%236a1b9a%22%20d%3D%22M14%201.483C7.116%201.483%201.483%207.116%201.483%2014S7.116%2026.517%2014%2026.517S26.517%2020.884%2026.517%2014S20.884%201.483%2014%201.483m-6.974%2019.49c-1.877-1.877-2.86-4.38-2.86-6.794l9.745%209.656c-2.504-.09-5.007-.984-6.885-2.861zm9.12%202.594L4.433%2011.854C5.417%207.474%209.351%204.165%2014%204.165c3.308%200%206.17%201.61%207.957%204.024l-1.34%201.162C19.096%207.294%2016.681%205.953%2014%205.953c-3.487%200-6.437%202.236-7.6%205.365L16.682%2021.6c2.593-.894%204.56-3.13%205.186-5.812h-4.292V14h6.259c0%204.65-3.308%208.583-7.69%209.567z%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%2028%2028%22%3E%3Cpath%20fill%3D%22%23fafafa%22%20d%3D%22M23.835%2014h-6.259v1.788h4.292c-.626%202.682-2.593%204.918-5.186%205.812L6.4%2011.318c1.073-3.13%204.113-5.365%207.6-5.365c2.682%200%205.096%201.342%206.616%203.398l1.341-1.162C20.17%205.775%2017.308%204.165%2014%204.165c-4.65%200-8.583%203.308-9.566%207.69l11.801%2011.801c4.292-1.073%207.6-5.007%207.6-9.656m-19.67.09c0%202.503.984%204.917%202.861%206.794s4.381%202.861%206.795%202.861z%22%2F%3E%3Cpath%20fill%3D%22%236a1b9a%22%20d%3D%22M14%201.483C7.116%201.483%201.483%207.116%201.483%2014S7.116%2026.517%2014%2026.517S26.517%2020.884%2026.517%2014S20.884%201.483%2014%201.483m-6.974%2019.49c-1.877-1.877-2.86-4.38-2.86-6.794l9.745%209.656c-2.504-.09-5.007-.984-6.885-2.861zm9.12%202.594L4.433%2011.854C5.417%207.474%209.351%204.165%2014%204.165c3.308%200%206.17%201.61%207.957%204.024l-1.34%201.162C19.096%207.294%2016.681%205.953%2014%205.953c-3.487%200-6.437%202.236-7.6%205.365L16.682%2021.6c2.593-.894%204.56-3.13%205.186-5.812h-4.292V14h6.259c0%204.65-3.308%208.583-7.69%209.567z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/material-icon-theme/gatsby.svg?color=%231a73e8&size=48
