penpot logo
penpot from Simple Icons by Simple Icons Collaborators · Brand · CC0-1.0 Free for personal and commercial use.
- Name
- penpot
- Set
- Simple Icons
- Style
- Brand
- Viewbox
- 24×24
- License
- CC0 1.0
The same logo in other sets
Use the penpot logo
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M7.654 0L5.13 3.554v2.01L2.934 6.608l-.02-.009v13.109l8.563 4.045L12 24l.523-.247l8.563-4.045V6.6l-.017.008l-2.196-1.045V3.555l-.077-.108L16.349.001l-2.524 3.554v.004L11.989.973l-1.823 2.566l-.065-.091zm.447 2.065l.976 1.374H6.232l.964-1.358zm8.694 0l.976 1.374h-2.845l.965-1.358zm-4.36.971l.976 1.375h-2.845l.965-1.359zM5.962 4.132h1.35v4.544l-1.35-.638Zm2.042 0h1.343v5.506l-1.343-.635zm6.652 0h1.35V9l-1.35.637zm2.042 0h1.343v3.905l-1.343.634zm-6.402.972h1.35v5.62l-1.35-.638zm2.042 0h1.343v4.993l-1.343.634zm6.534 1.493l1.188.486l-1.188.561zM5.13 6.6v1.047l-1.187-.561ZM3.96 8.251l7.517 3.55v10.795l-7.516-3.55zm16.08 0v10.794l-7.517 3.55V11.802z"/></svg>
React
import type { SVGProps } from "react";
export function SimpleIconsPenpot(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="M7.654 0L5.13 3.554v2.01L2.934 6.608l-.02-.009v13.109l8.563 4.045L12 24l.523-.247l8.563-4.045V6.6l-.017.008l-2.196-1.045V3.555l-.077-.108L16.349.001l-2.524 3.554v.004L11.989.973l-1.823 2.566l-.065-.091zm.447 2.065l.976 1.374H6.232l.964-1.358zm8.694 0l.976 1.374h-2.845l.965-1.358zm-4.36.971l.976 1.375h-2.845l.965-1.359zM5.962 4.132h1.35v4.544l-1.35-.638Zm2.042 0h1.343v5.506l-1.343-.635zm6.652 0h1.35V9l-1.35.637zm2.042 0h1.343v3.905l-1.343.634zm-6.402.972h1.35v5.62l-1.35-.638zm2.042 0h1.343v4.993l-1.343.634zm6.534 1.493l1.188.486l-1.188.561zM5.13 6.6v1.047l-1.187-.561ZM3.96 8.251l7.517 3.55v10.795l-7.516-3.55zm16.08 0v10.794l-7.517 3.55V11.802z"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M7.654 0L5.13 3.554v2.01L2.934 6.608l-.02-.009v13.109l8.563 4.045L12 24l.523-.247l8.563-4.045V6.6l-.017.008l-2.196-1.045V3.555l-.077-.108L16.349.001l-2.524 3.554v.004L11.989.973l-1.823 2.566l-.065-.091zm.447 2.065l.976 1.374H6.232l.964-1.358zm8.694 0l.976 1.374h-2.845l.965-1.358zm-4.36.971l.976 1.375h-2.845l.965-1.359zM5.962 4.132h1.35v4.544l-1.35-.638Zm2.042 0h1.343v5.506l-1.343-.635zm6.652 0h1.35V9l-1.35.637zm2.042 0h1.343v3.905l-1.343.634zm-6.402.972h1.35v5.62l-1.35-.638zm2.042 0h1.343v4.993l-1.343.634zm6.534 1.493l1.188.486l-1.188.561zM5.13 6.6v1.047l-1.187-.561ZM3.96 8.251l7.517 3.55v10.795l-7.516-3.55zm16.08 0v10.794l-7.517 3.55V11.802z"/></svg> </template>
CSS
.icon-penpot {
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%22M7.654%200L5.13%203.554v2.01L2.934%206.608l-.02-.009v13.109l8.563%204.045L12%2024l.523-.247l8.563-4.045V6.6l-.017.008l-2.196-1.045V3.555l-.077-.108L16.349.001l-2.524%203.554v.004L11.989.973l-1.823%202.566l-.065-.091zm.447%202.065l.976%201.374H6.232l.964-1.358zm8.694%200l.976%201.374h-2.845l.965-1.358zm-4.36.971l.976%201.375h-2.845l.965-1.359zM5.962%204.132h1.35v4.544l-1.35-.638Zm2.042%200h1.343v5.506l-1.343-.635zm6.652%200h1.35V9l-1.35.637zm2.042%200h1.343v3.905l-1.343.634zm-6.402.972h1.35v5.62l-1.35-.638zm2.042%200h1.343v4.993l-1.343.634zm6.534%201.493l1.188.486l-1.188.561zM5.13%206.6v1.047l-1.187-.561ZM3.96%208.251l7.517%203.55v10.795l-7.516-3.55zm16.08%200v10.794l-7.517%203.55V11.802z%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%22M7.654%200L5.13%203.554v2.01L2.934%206.608l-.02-.009v13.109l8.563%204.045L12%2024l.523-.247l8.563-4.045V6.6l-.017.008l-2.196-1.045V3.555l-.077-.108L16.349.001l-2.524%203.554v.004L11.989.973l-1.823%202.566l-.065-.091zm.447%202.065l.976%201.374H6.232l.964-1.358zm8.694%200l.976%201.374h-2.845l.965-1.358zm-4.36.971l.976%201.375h-2.845l.965-1.359zM5.962%204.132h1.35v4.544l-1.35-.638Zm2.042%200h1.343v5.506l-1.343-.635zm6.652%200h1.35V9l-1.35.637zm2.042%200h1.343v3.905l-1.343.634zm-6.402.972h1.35v5.62l-1.35-.638zm2.042%200h1.343v4.993l-1.343.634zm6.534%201.493l1.188.486l-1.188.561zM5.13%206.6v1.047l-1.187-.561ZM3.96%208.251l7.517%203.55v10.795l-7.516-3.55zm16.08%200v10.794l-7.517%203.55V11.802z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/simple-icons/penpot.svg?color=%231a73e8&size=48
