logo youtube icon
logo-youtube from IonIcons by Ben Sperry · Regular · MIT Free for personal and commercial use.
- Name
- logo-youtube
- Set
- IonIcons
- Style
- Regular
- Viewbox
- 512×512
- License
- MIT
- Aliases
- logo-youtube-outline, social-youtube
The same icon in other sets
Related icons in IonIcons
logo-alipaylogo-amazonlogo-amplifylogo-androidlogo-angularlogo-appflowlogo-applelogo-apple-appstorelogo-apple-arlogo-behancelogo-bitbucketlogo-bitcoinlogo-bufferlogo-capacitorlogo-chromelogo-closed-captioninglogo-codepenlogo-css3logo-designernewslogo-deviantartlogo-discordlogo-dockerlogo-dribbblelogo-dropbox
Use the logo youtube icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path fill="currentColor" d="M508.64 148.79c0-45-33.1-81.2-74-81.2C379.24 65 322.74 64 265 64h-18c-57.6 0-114.2 1-169.6 3.6C36.6 67.6 3.5 104 3.5 149C1 184.59-.06 220.19 0 255.79q-.15 53.4 3.4 106.9c0 45 33.1 81.5 73.9 81.5c58.2 2.7 117.9 3.9 178.6 3.8q91.2.3 178.6-3.8c40.9 0 74-36.5 74-81.5c2.4-35.7 3.5-71.3 3.4-107q.34-53.4-3.26-106.9M207 353.89v-196.5l145 98.2Z"/></svg>
React
import type { SVGProps } from "react";
export function IonLogoYoutube(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path fill="currentColor" d="M508.64 148.79c0-45-33.1-81.2-74-81.2C379.24 65 322.74 64 265 64h-18c-57.6 0-114.2 1-169.6 3.6C36.6 67.6 3.5 104 3.5 149C1 184.59-.06 220.19 0 255.79q-.15 53.4 3.4 106.9c0 45 33.1 81.5 73.9 81.5c58.2 2.7 117.9 3.9 178.6 3.8q91.2.3 178.6-3.8c40.9 0 74-36.5 74-81.5c2.4-35.7 3.5-71.3 3.4-107q.34-53.4-3.26-106.9M207 353.89v-196.5l145 98.2Z"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path fill="currentColor" d="M508.64 148.79c0-45-33.1-81.2-74-81.2C379.24 65 322.74 64 265 64h-18c-57.6 0-114.2 1-169.6 3.6C36.6 67.6 3.5 104 3.5 149C1 184.59-.06 220.19 0 255.79q-.15 53.4 3.4 106.9c0 45 33.1 81.5 73.9 81.5c58.2 2.7 117.9 3.9 178.6 3.8q91.2.3 178.6-3.8c40.9 0 74-36.5 74-81.5c2.4-35.7 3.5-71.3 3.4-107q.34-53.4-3.26-106.9M207 353.89v-196.5l145 98.2Z"/></svg> </template>
CSS
.icon-logo-youtube {
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%20512%20512%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M508.64%20148.79c0-45-33.1-81.2-74-81.2C379.24%2065%20322.74%2064%20265%2064h-18c-57.6%200-114.2%201-169.6%203.6C36.6%2067.6%203.5%20104%203.5%20149C1%20184.59-.06%20220.19%200%20255.79q-.15%2053.4%203.4%20106.9c0%2045%2033.1%2081.5%2073.9%2081.5c58.2%202.7%20117.9%203.9%20178.6%203.8q91.2.3%20178.6-3.8c40.9%200%2074-36.5%2074-81.5c2.4-35.7%203.5-71.3%203.4-107q.34-53.4-3.26-106.9M207%20353.89v-196.5l145%2098.2Z%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%20512%20512%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M508.64%20148.79c0-45-33.1-81.2-74-81.2C379.24%2065%20322.74%2064%20265%2064h-18c-57.6%200-114.2%201-169.6%203.6C36.6%2067.6%203.5%20104%203.5%20149C1%20184.59-.06%20220.19%200%20255.79q-.15%2053.4%203.4%20106.9c0%2045%2033.1%2081.5%2073.9%2081.5c58.2%202.7%20117.9%203.9%20178.6%203.8q91.2.3%20178.6-3.8c40.9%200%2074-36.5%2074-81.5c2.4-35.7%203.5-71.3%203.4-107q.34-53.4-3.26-106.9M207%20353.89v-196.5l145%2098.2Z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/ion/logo-youtube.svg?color=%231a73e8&size=48
