dropzone logo

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

Name
dropzone
Set
SVG Logos
Style
Color
Viewbox
256×256
License
CC0

Use the dropzone logo

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><g fill="#028bf4"><path d="M128 42.667c-47.129 0-85.333 38.204-85.333 85.333v85.333H128c47.129 0 85.333-38.204 85.333-85.333S175.13 42.667 128 42.667M128 192H64v-64c0-35.346 28.654-64 64-64s64 28.654 64 64s-28.65 64-64 64"/><path d="M128 85.333c-23.563 0-42.667 19.104-42.667 42.667v42.667H128c23.563 0 42.667-19.104 42.667-42.667S151.563 85.333 128 85.333m0 64h-21.333V128c0-11.78 9.553-21.333 21.333-21.333s21.333 9.553 21.333 21.333s-9.55 21.333-21.333 21.333"/><path d="M128 0H0v256h128c70.692 0 128-57.308 128-128S198.692 0 128 0m0 234.667H21.333V128C21.333 69.092 69.092 21.333 128 21.333S234.667 69.092 234.667 128S186.912 234.667 128 234.667"/></g></svg>

React

import type { SVGProps } from "react";

export function LogosDropzone(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><g fill="#028bf4"><path d="M128 42.667c-47.129 0-85.333 38.204-85.333 85.333v85.333H128c47.129 0 85.333-38.204 85.333-85.333S175.13 42.667 128 42.667M128 192H64v-64c0-35.346 28.654-64 64-64s64 28.654 64 64s-28.65 64-64 64"/><path d="M128 85.333c-23.563 0-42.667 19.104-42.667 42.667v42.667H128c23.563 0 42.667-19.104 42.667-42.667S151.563 85.333 128 85.333m0 64h-21.333V128c0-11.78 9.553-21.333 21.333-21.333s21.333 9.553 21.333 21.333s-9.55 21.333-21.333 21.333"/><path d="M128 0H0v256h128c70.692 0 128-57.308 128-128S198.692 0 128 0m0 234.667H21.333V128C21.333 69.092 69.092 21.333 128 21.333S234.667 69.092 234.667 128S186.912 234.667 128 234.667"/></g></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><g fill="#028bf4"><path d="M128 42.667c-47.129 0-85.333 38.204-85.333 85.333v85.333H128c47.129 0 85.333-38.204 85.333-85.333S175.13 42.667 128 42.667M128 192H64v-64c0-35.346 28.654-64 64-64s64 28.654 64 64s-28.65 64-64 64"/><path d="M128 85.333c-23.563 0-42.667 19.104-42.667 42.667v42.667H128c23.563 0 42.667-19.104 42.667-42.667S151.563 85.333 128 85.333m0 64h-21.333V128c0-11.78 9.553-21.333 21.333-21.333s21.333 9.553 21.333 21.333s-9.55 21.333-21.333 21.333"/><path d="M128 0H0v256h128c70.692 0 128-57.308 128-128S198.692 0 128 0m0 234.667H21.333V128C21.333 69.092 69.092 21.333 128 21.333S234.667 69.092 234.667 128S186.912 234.667 128 234.667"/></g></svg>
</template>

CSS

.icon-dropzone {
  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%20256%22%3E%3Cg%20fill%3D%22%23028bf4%22%3E%3Cpath%20d%3D%22M128%2042.667c-47.129%200-85.333%2038.204-85.333%2085.333v85.333H128c47.129%200%2085.333-38.204%2085.333-85.333S175.13%2042.667%20128%2042.667M128%20192H64v-64c0-35.346%2028.654-64%2064-64s64%2028.654%2064%2064s-28.65%2064-64%2064%22%2F%3E%3Cpath%20d%3D%22M128%2085.333c-23.563%200-42.667%2019.104-42.667%2042.667v42.667H128c23.563%200%2042.667-19.104%2042.667-42.667S151.563%2085.333%20128%2085.333m0%2064h-21.333V128c0-11.78%209.553-21.333%2021.333-21.333s21.333%209.553%2021.333%2021.333s-9.55%2021.333-21.333%2021.333%22%2F%3E%3Cpath%20d%3D%22M128%200H0v256h128c70.692%200%20128-57.308%20128-128S198.692%200%20128%200m0%20234.667H21.333V128C21.333%2069.092%2069.092%2021.333%20128%2021.333S234.667%2069.092%20234.667%20128S186.912%20234.667%20128%20234.667%22%2F%3E%3C%2Fg%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%20256%22%3E%3Cg%20fill%3D%22%23028bf4%22%3E%3Cpath%20d%3D%22M128%2042.667c-47.129%200-85.333%2038.204-85.333%2085.333v85.333H128c47.129%200%2085.333-38.204%2085.333-85.333S175.13%2042.667%20128%2042.667M128%20192H64v-64c0-35.346%2028.654-64%2064-64s64%2028.654%2064%2064s-28.65%2064-64%2064%22%2F%3E%3Cpath%20d%3D%22M128%2085.333c-23.563%200-42.667%2019.104-42.667%2042.667v42.667H128c23.563%200%2042.667-19.104%2042.667-42.667S151.563%2085.333%20128%2085.333m0%2064h-21.333V128c0-11.78%209.553-21.333%2021.333-21.333s21.333%209.553%2021.333%2021.333s-9.55%2021.333-21.333%2021.333%22%2F%3E%3Cpath%20d%3D%22M128%200H0v256h128c70.692%200%20128-57.308%20128-128S198.692%200%20128%200m0%20234.667H21.333V128C21.333%2069.092%2069.092%2021.333%20128%2021.333S234.667%2069.092%20234.667%20128S186.912%20234.667%20128%20234.667%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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