youtube logo

youtube from Font Awesome 6 Brands by Dave Gandy · Regular · Audio & Video · CC-BY-4.0 Attribution required.

Name
youtube
Set
Font Awesome 6 Brands
Style
Regular
Category
Audio & Video
Viewbox
576×512
License
CC BY 4.0

The same logo in other sets

youtube-fillAkar Iconsyoutube-filledAnt Design IconsyoutubeBootstrap IconsyoutubeBoxicons BrandsyoutubeCoreUI BrandsyoutubeFont Awesome BrandsyoutubeFeather Iconsyoutube-solidFlowbite Iconsyoutubecss.ggyoutubeHuge IconsyoutubeIconParkyoutubeIconPark OutlineyoutubeIconPark SolidyoutubeIconPark TwoToneyoutubeIconoiryoutubeJam IconsyoutubeLine AwesomeyoutubeMaterial Line IconsyoutubeSVG LogosyoutubeLucideyoutubeMage IconsyoutubeMaterial Design Iconsyoutube-fillMingCute IconyoutubeMyna UI Icons

Use the youtube logo

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 576 512"><path fill="currentColor" d="M549.655 124.083c-6.281-23.65-24.787-42.276-48.284-48.597C458.781 64 288 64 288 64S117.22 64 74.629 75.486c-23.497 6.322-42.003 24.947-48.284 48.597c-11.412 42.867-11.412 132.305-11.412 132.305s0 89.438 11.412 132.305c6.281 23.65 24.787 41.5 48.284 47.821C117.22 448 288 448 288 448s170.78 0 213.371-11.486c23.497-6.321 42.003-24.171 48.284-47.821c11.412-42.867 11.412-132.305 11.412-132.305s0-89.438-11.412-132.305m-317.51 213.508V175.185l142.739 81.205z"/></svg>

React

import type { SVGProps } from "react";

export function Fa6BrandsYoutube(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 576 512"><path fill="currentColor" d="M549.655 124.083c-6.281-23.65-24.787-42.276-48.284-48.597C458.781 64 288 64 288 64S117.22 64 74.629 75.486c-23.497 6.322-42.003 24.947-48.284 48.597c-11.412 42.867-11.412 132.305-11.412 132.305s0 89.438 11.412 132.305c6.281 23.65 24.787 41.5 48.284 47.821C117.22 448 288 448 288 448s170.78 0 213.371-11.486c23.497-6.321 42.003-24.171 48.284-47.821c11.412-42.867 11.412-132.305 11.412-132.305s0-89.438-11.412-132.305m-317.51 213.508V175.185l142.739 81.205z"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 576 512"><path fill="currentColor" d="M549.655 124.083c-6.281-23.65-24.787-42.276-48.284-48.597C458.781 64 288 64 288 64S117.22 64 74.629 75.486c-23.497 6.322-42.003 24.947-48.284 48.597c-11.412 42.867-11.412 132.305-11.412 132.305s0 89.438 11.412 132.305c6.281 23.65 24.787 41.5 48.284 47.821C117.22 448 288 448 288 448s170.78 0 213.371-11.486c23.497-6.321 42.003-24.171 48.284-47.821c11.412-42.867 11.412-132.305 11.412-132.305s0-89.438-11.412-132.305m-317.51 213.508V175.185l142.739 81.205z"/></svg>
</template>

CSS

.icon-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%20576%20512%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M549.655%20124.083c-6.281-23.65-24.787-42.276-48.284-48.597C458.781%2064%20288%2064%20288%2064S117.22%2064%2074.629%2075.486c-23.497%206.322-42.003%2024.947-48.284%2048.597c-11.412%2042.867-11.412%20132.305-11.412%20132.305s0%2089.438%2011.412%20132.305c6.281%2023.65%2024.787%2041.5%2048.284%2047.821C117.22%20448%20288%20448%20288%20448s170.78%200%20213.371-11.486c23.497-6.321%2042.003-24.171%2048.284-47.821c11.412-42.867%2011.412-132.305%2011.412-132.305s0-89.438-11.412-132.305m-317.51%20213.508V175.185l142.739%2081.205z%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%20576%20512%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M549.655%20124.083c-6.281-23.65-24.787-42.276-48.284-48.597C458.781%2064%20288%2064%20288%2064S117.22%2064%2074.629%2075.486c-23.497%206.322-42.003%2024.947-48.284%2048.597c-11.412%2042.867-11.412%20132.305-11.412%20132.305s0%2089.438%2011.412%20132.305c6.281%2023.65%2024.787%2041.5%2048.284%2047.821C117.22%20448%20288%20448%20288%20448s170.78%200%20213.371-11.486c23.497-6.321%2042.003-24.171%2048.284-47.821c11.412-42.867%2011.412-132.305%2011.412-132.305s0-89.438-11.412-132.305m-317.51%20213.508V175.185l142.739%2081.205z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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