tectonic logo

tectonic from SVG Logos by Gil Barbara · Color · CC0-1.0 Free for personal and commercial use.

Name
tectonic
Set
SVG Logos
Style
Color
Viewbox
256×278
License
CC0

Use the tectonic logo

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 278"><path d="M180.168 100.573L128.1 77.385l-52.055 23.172l52.055 30.077v60.117l46.118-33.508l5.951-56.67z" fill="#FFF"/><path d="M38.213 78.714l37.83 21.843L128.1 77.385l52.07 23.188l-5.952 56.67L128.1 190.75v43.68l79.624-57.848l10.282-97.866L128.1 38.691L38.213 78.714z" fill="#68C28D"/><path d="M128.1.322L.685 57.052L15.27 195.778l112.827 81.98l112.845-81.98L255.52 57.06L128.1.322zm79.62 176.266l-79.62 57.843V130.634l-89.887-51.92l89.886-40.023l89.906 40.026l-10.284 97.871z" fill="#243A4C"/></svg>

React

import type { SVGProps } from "react";

export function LogosTectonic(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 278"><path d="M180.168 100.573L128.1 77.385l-52.055 23.172l52.055 30.077v60.117l46.118-33.508l5.951-56.67z" fill="#FFF"/><path d="M38.213 78.714l37.83 21.843L128.1 77.385l52.07 23.188l-5.952 56.67L128.1 190.75v43.68l79.624-57.848l10.282-97.866L128.1 38.691L38.213 78.714z" fill="#68C28D"/><path d="M128.1.322L.685 57.052L15.27 195.778l112.827 81.98l112.845-81.98L255.52 57.06L128.1.322zm79.62 176.266l-79.62 57.843V130.634l-89.887-51.92l89.886-40.023l89.906 40.026l-10.284 97.871z" fill="#243A4C"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 278"><path d="M180.168 100.573L128.1 77.385l-52.055 23.172l52.055 30.077v60.117l46.118-33.508l5.951-56.67z" fill="#FFF"/><path d="M38.213 78.714l37.83 21.843L128.1 77.385l52.07 23.188l-5.952 56.67L128.1 190.75v43.68l79.624-57.848l10.282-97.866L128.1 38.691L38.213 78.714z" fill="#68C28D"/><path d="M128.1.322L.685 57.052L15.27 195.778l112.827 81.98l112.845-81.98L255.52 57.06L128.1.322zm79.62 176.266l-79.62 57.843V130.634l-89.887-51.92l89.886-40.023l89.906 40.026l-10.284 97.871z" fill="#243A4C"/></svg>
</template>

CSS

.icon-tectonic {
  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%20278%22%3E%3Cpath%20d%3D%22M180.168%20100.573L128.1%2077.385l-52.055%2023.172l52.055%2030.077v60.117l46.118-33.508l5.951-56.67z%22%20fill%3D%22%23FFF%22%2F%3E%3Cpath%20d%3D%22M38.213%2078.714l37.83%2021.843L128.1%2077.385l52.07%2023.188l-5.952%2056.67L128.1%20190.75v43.68l79.624-57.848l10.282-97.866L128.1%2038.691L38.213%2078.714z%22%20fill%3D%22%2368C28D%22%2F%3E%3Cpath%20d%3D%22M128.1.322L.685%2057.052L15.27%20195.778l112.827%2081.98l112.845-81.98L255.52%2057.06L128.1.322zm79.62%20176.266l-79.62%2057.843V130.634l-89.887-51.92l89.886-40.023l89.906%2040.026l-10.284%2097.871z%22%20fill%3D%22%23243A4C%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%20278%22%3E%3Cpath%20d%3D%22M180.168%20100.573L128.1%2077.385l-52.055%2023.172l52.055%2030.077v60.117l46.118-33.508l5.951-56.67z%22%20fill%3D%22%23FFF%22%2F%3E%3Cpath%20d%3D%22M38.213%2078.714l37.83%2021.843L128.1%2077.385l52.07%2023.188l-5.952%2056.67L128.1%20190.75v43.68l79.624-57.848l10.282-97.866L128.1%2038.691L38.213%2078.714z%22%20fill%3D%22%2368C28D%22%2F%3E%3Cpath%20d%3D%22M128.1.322L.685%2057.052L15.27%20195.778l112.827%2081.98l112.845-81.98L255.52%2057.06L128.1.322zm79.62%20176.266l-79.62%2057.843V130.634l-89.887-51.92l89.886-40.023l89.906%2040.026l-10.284%2097.871z%22%20fill%3D%22%23243A4C%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/logos/tectonic.svg?color=%231a73e8&size=48