webpack logo

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

Name: webpack
Set: SVG Logos
Style: Color
Viewbox: 256×290
License: CC0

The same logo in other sets

webpackCatppuccin Icons webpackDevicon webpackMaterial Design Icons webpackSimple Icons webpack-darkSkill Icons webpack-outlineTeenyicons

Use the webpack logo

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 290"><path fill="#fff" d="m128 .048l128 72.405V217.31l-128 72.405L0 217.31V72.453z"/><path fill="#8ed6fb" d="m233.153 212.287l-100.902 57.14V224.99l62.889-34.632zm6.907-6.231V86.654l-36.902 21.3v76.8zm-217.6 6.23l100.903 57.094v-44.438l-62.889-34.584zm-6.907-6.23V86.654l36.903 21.3v76.8zm4.3-127.13l103.51-58.543v42.99L57.045 99.84l-.532.29zm215.86 0L132.251 20.382v42.99l66.27 36.515l.531.29z"/><path fill="#1c78c0" d="m123.363 214.847l-62.02-34.15v-67.574l62.02 35.792zm8.888 0l62.02-34.101v-67.623l-62.02 35.792zM65.497 105.298l62.31-34.246l62.26 34.246l-62.26 35.937z"/></svg>

React

import type { SVGProps } from "react";

export function LogosWebpack(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 290"><path fill="#fff" d="m128 .048l128 72.405V217.31l-128 72.405L0 217.31V72.453z"/><path fill="#8ed6fb" d="m233.153 212.287l-100.902 57.14V224.99l62.889-34.632zm6.907-6.231V86.654l-36.902 21.3v76.8zm-217.6 6.23l100.903 57.094v-44.438l-62.889-34.584zm-6.907-6.23V86.654l36.903 21.3v76.8zm4.3-127.13l103.51-58.543v42.99L57.045 99.84l-.532.29zm215.86 0L132.251 20.382v42.99l66.27 36.515l.531.29z"/><path fill="#1c78c0" d="m123.363 214.847l-62.02-34.15v-67.574l62.02 35.792zm8.888 0l62.02-34.101v-67.623l-62.02 35.792zM65.497 105.298l62.31-34.246l62.26 34.246l-62.26 35.937z"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 290"><path fill="#fff" d="m128 .048l128 72.405V217.31l-128 72.405L0 217.31V72.453z"/><path fill="#8ed6fb" d="m233.153 212.287l-100.902 57.14V224.99l62.889-34.632zm6.907-6.231V86.654l-36.902 21.3v76.8zm-217.6 6.23l100.903 57.094v-44.438l-62.889-34.584zm-6.907-6.23V86.654l36.903 21.3v76.8zm4.3-127.13l103.51-58.543v42.99L57.045 99.84l-.532.29zm215.86 0L132.251 20.382v42.99l66.27 36.515l.531.29z"/><path fill="#1c78c0" d="m123.363 214.847l-62.02-34.15v-67.574l62.02 35.792zm8.888 0l62.02-34.101v-67.623l-62.02 35.792zM65.497 105.298l62.31-34.246l62.26 34.246l-62.26 35.937z"/></svg>
</template>

CSS

.icon-webpack {
  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%20290%22%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22m128%20.048l128%2072.405V217.31l-128%2072.405L0%20217.31V72.453z%22%2F%3E%3Cpath%20fill%3D%22%238ed6fb%22%20d%3D%22m233.153%20212.287l-100.902%2057.14V224.99l62.889-34.632zm6.907-6.231V86.654l-36.902%2021.3v76.8zm-217.6%206.23l100.903%2057.094v-44.438l-62.889-34.584zm-6.907-6.23V86.654l36.903%2021.3v76.8zm4.3-127.13l103.51-58.543v42.99L57.045%2099.84l-.532.29zm215.86%200L132.251%2020.382v42.99l66.27%2036.515l.531.29z%22%2F%3E%3Cpath%20fill%3D%22%231c78c0%22%20d%3D%22m123.363%20214.847l-62.02-34.15v-67.574l62.02%2035.792zm8.888%200l62.02-34.101v-67.623l-62.02%2035.792zM65.497%20105.298l62.31-34.246l62.26%2034.246l-62.26%2035.937z%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%20290%22%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22m128%20.048l128%2072.405V217.31l-128%2072.405L0%20217.31V72.453z%22%2F%3E%3Cpath%20fill%3D%22%238ed6fb%22%20d%3D%22m233.153%20212.287l-100.902%2057.14V224.99l62.889-34.632zm6.907-6.231V86.654l-36.902%2021.3v76.8zm-217.6%206.23l100.903%2057.094v-44.438l-62.889-34.584zm-6.907-6.23V86.654l36.903%2021.3v76.8zm4.3-127.13l103.51-58.543v42.99L57.045%2099.84l-.532.29zm215.86%200L132.251%2020.382v42.99l66.27%2036.515l.531.29z%22%2F%3E%3Cpath%20fill%3D%22%231c78c0%22%20d%3D%22m123.363%20214.847l-62.02-34.15v-67.574l62.02%2035.792zm8.888%200l62.02-34.101v-67.623l-62.02%2035.792zM65.497%20105.298l62.31-34.246l62.26%2034.246l-62.26%2035.937z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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