penpot icon logo

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

Name
penpot-icon
Set
SVG Logos
Style
Color
Viewbox
256×339
License
CC0

Use the penpot icon logo

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 339"><path d="M153.71 50.078L189.268 0l35.558 50.078v28.279l30.948 14.721l.227-.107v184.681l-120.628 56.99L128 338.12l-7.371-3.48L0 277.653V92.972l.279.13l30.94-14.716V50.078L66.774 0l35.393 49.848l25.67-36.16l25.874 36.44zM14.742 116.24v152.073l105.888 50.021V166.262zm226.516 0l-105.885 50.021v152.073l105.885-50.02zm-89.575-44.334h-18.914v79.283l18.914-8.937zm-28.675 0h-19.012v70.191l19.012 8.983zM90.62 58.218H71.703v68.626l18.917 8.935zm93.816 0h-19.01v77.54l19.01-8.98zm-122.494 0H42.93v55.034l19.01 8.982zm151.168 0h-18.915v63.948l18.915-8.936zM31.219 92.97l-16.735 6.842l16.735 7.907zm193.602-.025v14.75l16.739-7.906zM134.128 42.78l-12.74.226l-13.59 19.14h40.082zM73.064 29.09l-12.74.227l-13.592 19.14h40.085zm122.491 0l-12.741.227l-13.59 19.14h40.087z"/></svg>

React

import type { SVGProps } from "react";

export function LogosPenpotIcon(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 339"><path d="M153.71 50.078L189.268 0l35.558 50.078v28.279l30.948 14.721l.227-.107v184.681l-120.628 56.99L128 338.12l-7.371-3.48L0 277.653V92.972l.279.13l30.94-14.716V50.078L66.774 0l35.393 49.848l25.67-36.16l25.874 36.44zM14.742 116.24v152.073l105.888 50.021V166.262zm226.516 0l-105.885 50.021v152.073l105.885-50.02zm-89.575-44.334h-18.914v79.283l18.914-8.937zm-28.675 0h-19.012v70.191l19.012 8.983zM90.62 58.218H71.703v68.626l18.917 8.935zm93.816 0h-19.01v77.54l19.01-8.98zm-122.494 0H42.93v55.034l19.01 8.982zm151.168 0h-18.915v63.948l18.915-8.936zM31.219 92.97l-16.735 6.842l16.735 7.907zm193.602-.025v14.75l16.739-7.906zM134.128 42.78l-12.74.226l-13.59 19.14h40.082zM73.064 29.09l-12.74.227l-13.592 19.14h40.085zm122.491 0l-12.741.227l-13.59 19.14h40.087z"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 339"><path d="M153.71 50.078L189.268 0l35.558 50.078v28.279l30.948 14.721l.227-.107v184.681l-120.628 56.99L128 338.12l-7.371-3.48L0 277.653V92.972l.279.13l30.94-14.716V50.078L66.774 0l35.393 49.848l25.67-36.16l25.874 36.44zM14.742 116.24v152.073l105.888 50.021V166.262zm226.516 0l-105.885 50.021v152.073l105.885-50.02zm-89.575-44.334h-18.914v79.283l18.914-8.937zm-28.675 0h-19.012v70.191l19.012 8.983zM90.62 58.218H71.703v68.626l18.917 8.935zm93.816 0h-19.01v77.54l19.01-8.98zm-122.494 0H42.93v55.034l19.01 8.982zm151.168 0h-18.915v63.948l18.915-8.936zM31.219 92.97l-16.735 6.842l16.735 7.907zm193.602-.025v14.75l16.739-7.906zM134.128 42.78l-12.74.226l-13.59 19.14h40.082zM73.064 29.09l-12.74.227l-13.592 19.14h40.085zm122.491 0l-12.741.227l-13.59 19.14h40.087z"/></svg>
</template>

CSS

.icon-penpot-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%20339%22%3E%3Cpath%20d%3D%22M153.71%2050.078L189.268%200l35.558%2050.078v28.279l30.948%2014.721l.227-.107v184.681l-120.628%2056.99L128%20338.12l-7.371-3.48L0%20277.653V92.972l.279.13l30.94-14.716V50.078L66.774%200l35.393%2049.848l25.67-36.16l25.874%2036.44zM14.742%20116.24v152.073l105.888%2050.021V166.262zm226.516%200l-105.885%2050.021v152.073l105.885-50.02zm-89.575-44.334h-18.914v79.283l18.914-8.937zm-28.675%200h-19.012v70.191l19.012%208.983zM90.62%2058.218H71.703v68.626l18.917%208.935zm93.816%200h-19.01v77.54l19.01-8.98zm-122.494%200H42.93v55.034l19.01%208.982zm151.168%200h-18.915v63.948l18.915-8.936zM31.219%2092.97l-16.735%206.842l16.735%207.907zm193.602-.025v14.75l16.739-7.906zM134.128%2042.78l-12.74.226l-13.59%2019.14h40.082zM73.064%2029.09l-12.74.227l-13.592%2019.14h40.085zm122.491%200l-12.741.227l-13.59%2019.14h40.087z%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%20339%22%3E%3Cpath%20d%3D%22M153.71%2050.078L189.268%200l35.558%2050.078v28.279l30.948%2014.721l.227-.107v184.681l-120.628%2056.99L128%20338.12l-7.371-3.48L0%20277.653V92.972l.279.13l30.94-14.716V50.078L66.774%200l35.393%2049.848l25.67-36.16l25.874%2036.44zM14.742%20116.24v152.073l105.888%2050.021V166.262zm226.516%200l-105.885%2050.021v152.073l105.885-50.02zm-89.575-44.334h-18.914v79.283l18.914-8.937zm-28.675%200h-19.012v70.191l19.012%208.983zM90.62%2058.218H71.703v68.626l18.917%208.935zm93.816%200h-19.01v77.54l19.01-8.98zm-122.494%200H42.93v55.034l19.01%208.982zm151.168%200h-18.915v63.948l18.915-8.936zM31.219%2092.97l-16.735%206.842l16.735%207.907zm193.602-.025v14.75l16.739-7.906zM134.128%2042.78l-12.74.226l-13.59%2019.14h40.082zM73.064%2029.09l-12.74.227l-13.592%2019.14h40.085zm122.491%200l-12.741.227l-13.59%2019.14h40.087z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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