twitch logo

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

Name: twitch
Set: SVG Logos
Style: Color
Viewbox: 256×268
License: CC0

The same logo in other sets

twitch-fillAkar Icons twitch-filledAnt Design Icons twitchBootstrap Icons twitchBoxicons Brands twitchCoreUI Brands twitchFont Awesome 6 Brands twitchFont Awesome Brands twitchFeather Icons twitchHuge Icons twitchJam Icons twitchLine Awesome twitchLucide twitchMaterial Design Icons twitch-fillMingCute Icon twitchMyna UI Icons twitchPrime Icons twitch-fillRemix Icon twitchSimple Icons twitch-outlineTeenyicons

Use the twitch logo

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 268"><path fill="#5a3e85" d="M17.458 0L0 46.556v186.201h63.983v34.934h34.931l34.898-34.934h52.36L256 162.954V0zm23.259 23.263H232.73v128.029l-40.739 40.741H128L93.113 226.92v-34.886H40.717zm64.008 116.405H128V69.844h-23.275zm63.997 0h23.27V69.844h-23.27z"/></svg>

React

import type { SVGProps } from "react";

export function LogosTwitch(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 268"><path fill="#5a3e85" d="M17.458 0L0 46.556v186.201h63.983v34.934h34.931l34.898-34.934h52.36L256 162.954V0zm23.259 23.263H232.73v128.029l-40.739 40.741H128L93.113 226.92v-34.886H40.717zm64.008 116.405H128V69.844h-23.275zm63.997 0h23.27V69.844h-23.27z"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 268"><path fill="#5a3e85" d="M17.458 0L0 46.556v186.201h63.983v34.934h34.931l34.898-34.934h52.36L256 162.954V0zm23.259 23.263H232.73v128.029l-40.739 40.741H128L93.113 226.92v-34.886H40.717zm64.008 116.405H128V69.844h-23.275zm63.997 0h23.27V69.844h-23.27z"/></svg>
</template>

CSS

.icon-twitch {
  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%20268%22%3E%3Cpath%20fill%3D%22%235a3e85%22%20d%3D%22M17.458%200L0%2046.556v186.201h63.983v34.934h34.931l34.898-34.934h52.36L256%20162.954V0zm23.259%2023.263H232.73v128.029l-40.739%2040.741H128L93.113%20226.92v-34.886H40.717zm64.008%20116.405H128V69.844h-23.275zm63.997%200h23.27V69.844h-23.27z%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%20268%22%3E%3Cpath%20fill%3D%22%235a3e85%22%20d%3D%22M17.458%200L0%2046.556v186.201h63.983v34.934h34.931l34.898-34.934h52.36L256%20162.954V0zm23.259%2023.263H232.73v128.029l-40.739%2040.741H128L93.113%20226.92v-34.886H40.717zm64.008%20116.405H128V69.844h-23.275zm63.997%200h23.27V69.844h-23.27z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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