netlify icon logo

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

Name
netlify-icon
Set
SVG Logos
Style
Color
Viewbox
256×226
License
CC0

Use the netlify icon logo

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 226"><path fill="#05bdba" d="M69.181 188.087h-2.417l-12.065-12.065v-2.417l18.444-18.444h12.778l1.704 1.704v12.778zM54.699 51.628v-2.417l12.065-12.065h2.417L87.625 55.59v12.778l-1.704 1.704H73.143z"/><path fill="#014847" d="M160.906 149.198h-17.552l-1.466-1.466v-41.089c0-7.31-2.873-12.976-11.689-13.174c-4.537-.119-9.727 0-15.274.218l-.833.852v53.173l-1.466 1.466H95.074l-1.466-1.466v-70.19l1.466-1.467h39.503c15.354 0 27.795 12.441 27.795 27.795v43.882z"/><path fill="#05bdba" d="M71.677 122.889H1.466L0 121.423V103.83l1.466-1.466h70.211l1.466 1.466v17.593zm182.857 0h-70.211l-1.466-1.466V103.83l1.466-1.466h70.211L256 103.83v17.593zM117.876 54.124V1.466L119.342 0h17.593l1.466 1.466v52.658l-1.466 1.466h-17.593zm0 169.663v-52.658l1.466-1.466h17.593l1.466 1.466v52.658l-1.466 1.465h-17.593z"/></svg>

React

import type { SVGProps } from "react";

export function LogosNetlifyIcon(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 226"><path fill="#05bdba" d="M69.181 188.087h-2.417l-12.065-12.065v-2.417l18.444-18.444h12.778l1.704 1.704v12.778zM54.699 51.628v-2.417l12.065-12.065h2.417L87.625 55.59v12.778l-1.704 1.704H73.143z"/><path fill="#014847" d="M160.906 149.198h-17.552l-1.466-1.466v-41.089c0-7.31-2.873-12.976-11.689-13.174c-4.537-.119-9.727 0-15.274.218l-.833.852v53.173l-1.466 1.466H95.074l-1.466-1.466v-70.19l1.466-1.467h39.503c15.354 0 27.795 12.441 27.795 27.795v43.882z"/><path fill="#05bdba" d="M71.677 122.889H1.466L0 121.423V103.83l1.466-1.466h70.211l1.466 1.466v17.593zm182.857 0h-70.211l-1.466-1.466V103.83l1.466-1.466h70.211L256 103.83v17.593zM117.876 54.124V1.466L119.342 0h17.593l1.466 1.466v52.658l-1.466 1.466h-17.593zm0 169.663v-52.658l1.466-1.466h17.593l1.466 1.466v52.658l-1.466 1.465h-17.593z"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 226"><path fill="#05bdba" d="M69.181 188.087h-2.417l-12.065-12.065v-2.417l18.444-18.444h12.778l1.704 1.704v12.778zM54.699 51.628v-2.417l12.065-12.065h2.417L87.625 55.59v12.778l-1.704 1.704H73.143z"/><path fill="#014847" d="M160.906 149.198h-17.552l-1.466-1.466v-41.089c0-7.31-2.873-12.976-11.689-13.174c-4.537-.119-9.727 0-15.274.218l-.833.852v53.173l-1.466 1.466H95.074l-1.466-1.466v-70.19l1.466-1.467h39.503c15.354 0 27.795 12.441 27.795 27.795v43.882z"/><path fill="#05bdba" d="M71.677 122.889H1.466L0 121.423V103.83l1.466-1.466h70.211l1.466 1.466v17.593zm182.857 0h-70.211l-1.466-1.466V103.83l1.466-1.466h70.211L256 103.83v17.593zM117.876 54.124V1.466L119.342 0h17.593l1.466 1.466v52.658l-1.466 1.466h-17.593zm0 169.663v-52.658l1.466-1.466h17.593l1.466 1.466v52.658l-1.466 1.465h-17.593z"/></svg>
</template>

CSS

.icon-netlify-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%20226%22%3E%3Cpath%20fill%3D%22%2305bdba%22%20d%3D%22M69.181%20188.087h-2.417l-12.065-12.065v-2.417l18.444-18.444h12.778l1.704%201.704v12.778zM54.699%2051.628v-2.417l12.065-12.065h2.417L87.625%2055.59v12.778l-1.704%201.704H73.143z%22%2F%3E%3Cpath%20fill%3D%22%23014847%22%20d%3D%22M160.906%20149.198h-17.552l-1.466-1.466v-41.089c0-7.31-2.873-12.976-11.689-13.174c-4.537-.119-9.727%200-15.274.218l-.833.852v53.173l-1.466%201.466H95.074l-1.466-1.466v-70.19l1.466-1.467h39.503c15.354%200%2027.795%2012.441%2027.795%2027.795v43.882z%22%2F%3E%3Cpath%20fill%3D%22%2305bdba%22%20d%3D%22M71.677%20122.889H1.466L0%20121.423V103.83l1.466-1.466h70.211l1.466%201.466v17.593zm182.857%200h-70.211l-1.466-1.466V103.83l1.466-1.466h70.211L256%20103.83v17.593zM117.876%2054.124V1.466L119.342%200h17.593l1.466%201.466v52.658l-1.466%201.466h-17.593zm0%20169.663v-52.658l1.466-1.466h17.593l1.466%201.466v52.658l-1.466%201.465h-17.593z%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%20226%22%3E%3Cpath%20fill%3D%22%2305bdba%22%20d%3D%22M69.181%20188.087h-2.417l-12.065-12.065v-2.417l18.444-18.444h12.778l1.704%201.704v12.778zM54.699%2051.628v-2.417l12.065-12.065h2.417L87.625%2055.59v12.778l-1.704%201.704H73.143z%22%2F%3E%3Cpath%20fill%3D%22%23014847%22%20d%3D%22M160.906%20149.198h-17.552l-1.466-1.466v-41.089c0-7.31-2.873-12.976-11.689-13.174c-4.537-.119-9.727%200-15.274.218l-.833.852v53.173l-1.466%201.466H95.074l-1.466-1.466v-70.19l1.466-1.467h39.503c15.354%200%2027.795%2012.441%2027.795%2027.795v43.882z%22%2F%3E%3Cpath%20fill%3D%22%2305bdba%22%20d%3D%22M71.677%20122.889H1.466L0%20121.423V103.83l1.466-1.466h70.211l1.466%201.466v17.593zm182.857%200h-70.211l-1.466-1.466V103.83l1.466-1.466h70.211L256%20103.83v17.593zM117.876%2054.124V1.466L119.342%200h17.593l1.466%201.466v52.658l-1.466%201.466h-17.593zm0%20169.663v-52.658l1.466-1.466h17.593l1.466%201.466v52.658l-1.466%201.465h-17.593z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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