preact logo

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

Name
preact
Set
SVG Logos
Style
Color
Viewbox
256×296
License
CC0

The same logo in other sets

preactSimple Icons

Use the preact logo

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 296"><path fill="#673ab8" d="m128 0l128 73.9v147.8l-128 73.9L0 221.7V73.9z"/><path fill="#fff" d="M34.865 220.478c17.016 21.78 71.095 5.185 122.15-34.704c51.055-39.888 80.24-88.345 63.224-110.126c-17.017-21.78-71.095-5.184-122.15 34.704c-51.055 39.89-80.24 88.346-63.224 110.126m7.27-5.68c-5.644-7.222-3.178-21.402 7.573-39.253c11.322-18.797 30.541-39.548 54.06-57.923s48.303-32.004 69.281-38.442c19.922-6.113 34.277-5.075 39.92 2.148s3.178 21.403-7.573 39.254c-11.322 18.797-30.541 39.547-54.06 57.923c-23.52 18.375-48.304 32.004-69.281 38.441c-19.922 6.114-34.277 5.076-39.92-2.147"/><path fill="#fff" d="M220.239 220.478c17.017-21.78-12.169-70.237-63.224-110.126C105.96 70.464 51.88 53.868 34.865 75.648s12.169 70.238 63.224 110.126s105.133 56.485 122.15 34.704m-7.27-5.68c-5.643 7.224-19.998 8.262-39.92 2.148c-20.978-6.437-45.761-20.066-69.28-38.441c-23.52-18.376-42.74-39.126-54.06-57.923c-10.752-17.851-13.218-32.03-7.575-39.254c5.644-7.223 19.999-8.261 39.92-2.148c20.978 6.438 45.762 20.067 69.281 38.442s42.739 39.126 54.06 57.923c10.752 17.85 13.218 32.03 7.574 39.254"/><path fill="#fff" d="M127.552 167.667c10.827 0 19.603-8.777 19.603-19.604s-8.776-19.603-19.603-19.603s-19.604 8.777-19.604 19.603s8.777 19.604 19.604 19.604"/></svg>

React

import type { SVGProps } from "react";

export function LogosPreact(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 296"><path fill="#673ab8" d="m128 0l128 73.9v147.8l-128 73.9L0 221.7V73.9z"/><path fill="#fff" d="M34.865 220.478c17.016 21.78 71.095 5.185 122.15-34.704c51.055-39.888 80.24-88.345 63.224-110.126c-17.017-21.78-71.095-5.184-122.15 34.704c-51.055 39.89-80.24 88.346-63.224 110.126m7.27-5.68c-5.644-7.222-3.178-21.402 7.573-39.253c11.322-18.797 30.541-39.548 54.06-57.923s48.303-32.004 69.281-38.442c19.922-6.113 34.277-5.075 39.92 2.148s3.178 21.403-7.573 39.254c-11.322 18.797-30.541 39.547-54.06 57.923c-23.52 18.375-48.304 32.004-69.281 38.441c-19.922 6.114-34.277 5.076-39.92-2.147"/><path fill="#fff" d="M220.239 220.478c17.017-21.78-12.169-70.237-63.224-110.126C105.96 70.464 51.88 53.868 34.865 75.648s12.169 70.238 63.224 110.126s105.133 56.485 122.15 34.704m-7.27-5.68c-5.643 7.224-19.998 8.262-39.92 2.148c-20.978-6.437-45.761-20.066-69.28-38.441c-23.52-18.376-42.74-39.126-54.06-57.923c-10.752-17.851-13.218-32.03-7.575-39.254c5.644-7.223 19.999-8.261 39.92-2.148c20.978 6.438 45.762 20.067 69.281 38.442s42.739 39.126 54.06 57.923c10.752 17.85 13.218 32.03 7.574 39.254"/><path fill="#fff" d="M127.552 167.667c10.827 0 19.603-8.777 19.603-19.604s-8.776-19.603-19.603-19.603s-19.604 8.777-19.604 19.603s8.777 19.604 19.604 19.604"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 296"><path fill="#673ab8" d="m128 0l128 73.9v147.8l-128 73.9L0 221.7V73.9z"/><path fill="#fff" d="M34.865 220.478c17.016 21.78 71.095 5.185 122.15-34.704c51.055-39.888 80.24-88.345 63.224-110.126c-17.017-21.78-71.095-5.184-122.15 34.704c-51.055 39.89-80.24 88.346-63.224 110.126m7.27-5.68c-5.644-7.222-3.178-21.402 7.573-39.253c11.322-18.797 30.541-39.548 54.06-57.923s48.303-32.004 69.281-38.442c19.922-6.113 34.277-5.075 39.92 2.148s3.178 21.403-7.573 39.254c-11.322 18.797-30.541 39.547-54.06 57.923c-23.52 18.375-48.304 32.004-69.281 38.441c-19.922 6.114-34.277 5.076-39.92-2.147"/><path fill="#fff" d="M220.239 220.478c17.017-21.78-12.169-70.237-63.224-110.126C105.96 70.464 51.88 53.868 34.865 75.648s12.169 70.238 63.224 110.126s105.133 56.485 122.15 34.704m-7.27-5.68c-5.643 7.224-19.998 8.262-39.92 2.148c-20.978-6.437-45.761-20.066-69.28-38.441c-23.52-18.376-42.74-39.126-54.06-57.923c-10.752-17.851-13.218-32.03-7.575-39.254c5.644-7.223 19.999-8.261 39.92-2.148c20.978 6.438 45.762 20.067 69.281 38.442s42.739 39.126 54.06 57.923c10.752 17.85 13.218 32.03 7.574 39.254"/><path fill="#fff" d="M127.552 167.667c10.827 0 19.603-8.777 19.603-19.604s-8.776-19.603-19.603-19.603s-19.604 8.777-19.604 19.603s8.777 19.604 19.604 19.604"/></svg>
</template>

CSS

.icon-preact {
  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%20296%22%3E%3Cpath%20fill%3D%22%23673ab8%22%20d%3D%22m128%200l128%2073.9v147.8l-128%2073.9L0%20221.7V73.9z%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M34.865%20220.478c17.016%2021.78%2071.095%205.185%20122.15-34.704c51.055-39.888%2080.24-88.345%2063.224-110.126c-17.017-21.78-71.095-5.184-122.15%2034.704c-51.055%2039.89-80.24%2088.346-63.224%20110.126m7.27-5.68c-5.644-7.222-3.178-21.402%207.573-39.253c11.322-18.797%2030.541-39.548%2054.06-57.923s48.303-32.004%2069.281-38.442c19.922-6.113%2034.277-5.075%2039.92%202.148s3.178%2021.403-7.573%2039.254c-11.322%2018.797-30.541%2039.547-54.06%2057.923c-23.52%2018.375-48.304%2032.004-69.281%2038.441c-19.922%206.114-34.277%205.076-39.92-2.147%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M220.239%20220.478c17.017-21.78-12.169-70.237-63.224-110.126C105.96%2070.464%2051.88%2053.868%2034.865%2075.648s12.169%2070.238%2063.224%20110.126s105.133%2056.485%20122.15%2034.704m-7.27-5.68c-5.643%207.224-19.998%208.262-39.92%202.148c-20.978-6.437-45.761-20.066-69.28-38.441c-23.52-18.376-42.74-39.126-54.06-57.923c-10.752-17.851-13.218-32.03-7.575-39.254c5.644-7.223%2019.999-8.261%2039.92-2.148c20.978%206.438%2045.762%2020.067%2069.281%2038.442s42.739%2039.126%2054.06%2057.923c10.752%2017.85%2013.218%2032.03%207.574%2039.254%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M127.552%20167.667c10.827%200%2019.603-8.777%2019.603-19.604s-8.776-19.603-19.603-19.603s-19.604%208.777-19.604%2019.603s8.777%2019.604%2019.604%2019.604%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%20296%22%3E%3Cpath%20fill%3D%22%23673ab8%22%20d%3D%22m128%200l128%2073.9v147.8l-128%2073.9L0%20221.7V73.9z%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M34.865%20220.478c17.016%2021.78%2071.095%205.185%20122.15-34.704c51.055-39.888%2080.24-88.345%2063.224-110.126c-17.017-21.78-71.095-5.184-122.15%2034.704c-51.055%2039.89-80.24%2088.346-63.224%20110.126m7.27-5.68c-5.644-7.222-3.178-21.402%207.573-39.253c11.322-18.797%2030.541-39.548%2054.06-57.923s48.303-32.004%2069.281-38.442c19.922-6.113%2034.277-5.075%2039.92%202.148s3.178%2021.403-7.573%2039.254c-11.322%2018.797-30.541%2039.547-54.06%2057.923c-23.52%2018.375-48.304%2032.004-69.281%2038.441c-19.922%206.114-34.277%205.076-39.92-2.147%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M220.239%20220.478c17.017-21.78-12.169-70.237-63.224-110.126C105.96%2070.464%2051.88%2053.868%2034.865%2075.648s12.169%2070.238%2063.224%20110.126s105.133%2056.485%20122.15%2034.704m-7.27-5.68c-5.643%207.224-19.998%208.262-39.92%202.148c-20.978-6.437-45.761-20.066-69.28-38.441c-23.52-18.376-42.74-39.126-54.06-57.923c-10.752-17.851-13.218-32.03-7.575-39.254c5.644-7.223%2019.999-8.261%2039.92-2.148c20.978%206.438%2045.762%2020.067%2069.281%2038.442s42.739%2039.126%2054.06%2057.923c10.752%2017.85%2013.218%2032.03%207.574%2039.254%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M127.552%20167.667c10.827%200%2019.603-8.777%2019.603-19.604s-8.776-19.603-19.603-19.603s-19.604%208.777-19.604%2019.603s8.777%2019.604%2019.604%2019.604%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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