YouTube music

File: youtube-music.svg
viewBox: 0 0 983 983.2
Weight: 2 KB

Another company's mark, kept in the design system for reference. It belongs to its owner and isn't part of the Black Atmosphere set: for anything published, use the company's official file and follow its guidelines.

96px

160px

240px +

Use it

Download SVG

React

import { Illustration } from '@ba-icons/react';
import youtubeMusic from '@ba-icons/illustrations/media/youtube-music';

<Illustration asset={youtubeMusic} size={160} />

Vue

<script setup>
import { Illustration } from '@ba-icons/vue';
import youtubeMusic from '@ba-icons/illustrations/media/youtube-music';
</script>

<template>
  <Illustration :asset="youtubeMusic" :size="160" />
</template>

Astro

---
import { Illustration } from '@ba-icons/astro';
import youtubeMusic from '@ba-icons/illustrations/media/youtube-music';
---

<Illustration asset={youtubeMusic} size={160} />

HTML

<script src="https://icons.atmosphere.africa/cdn/ba-icons-0.4.0.js" defer></script>

<ba-illustration name="media/youtube-music" size="160"></ba-illustration>

SVG

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 983 983.2" fill="currentColor"><path d="M339.6 400.7Q340.6 401.7 341.6 403.2Q342.6 404.7 343.6 406.2Q344.6 407.7 344.6 408.7Q343.6 407.7 341.6 405.7Q339.6 404.7 338.6 403.7Q338.6 403.7 339.1 402.2Q339.6 400.7 339.6 400.7ZM471.6 963.7Q430.6 960.7 401.6 955.7Q291.6 933.7 203.6 865.7Q153.6 827.7 114.6 775.7Q53.6 695.7 31.1 597.7Q8.6 499.7 27.6 401.7Q49.6 290.7 117.6 202.7Q163.6 143.7 226.6 100.7Q303.6 47.7 397.1 28.7Q490.6 9.7 581.6 27.7Q706.6 52.7 800.6 134.7Q829.6 159.7 853.6 187.7Q931.6 281.7 955.6 401.7Q969.6 474.7 960.6 550.7Q942.6 690.7 850.6 798.7Q827.6 826.7 799.6 849.7Q704.6 931.7 581.6 955.7Q561.6 959.7 536.6 961.7Q498.6 965.7 471.6 963.7ZM521.6 736.7Q603.6 726.7 663.6 669.7Q696.6 636.7 716.6 594.7Q737.6 549.7 738.6 497.7Q739.6 445.7 720.6 399.7Q689.6 321.7 615.6 277.7Q601.6 268.7 581.6 261.7Q488.6 225.7 399.6 262.7Q319.6 294.7 276.6 368.7Q251.6 411.7 246.6 462.7Q241.6 497.7 247.6 529.7Q257.6 594.7 298.1 645.2Q338.6 695.7 399.6 720.7Q430.6 733.7 468.6 737.7Q476.6 738.7 495.1 738.2Q513.6 737.7 521.6 736.7ZM474.6 715.7Q471.6 715.7 461.6 714.7Q432.6 710.7 403.6 698.7Q359.6 679.7 327.6 645.2Q295.6 610.7 279.6 565.7Q271.6 544.7 268.6 521.7Q267.6 512.7 267.6 491.7Q267.6 470.7 268.6 461.7Q277.6 398.7 317.6 349.7Q357.6 300.7 417.6 279.7Q438.6 271.7 461.6 268.7Q470.6 267.7 491.6 267.7Q512.6 267.7 521.6 268.7Q609.6 280.7 664.6 348.7Q676.6 362.7 683.6 374.7Q706.6 412.7 713.6 457.7Q715.6 467.7 715.6 489.7Q715.6 511.7 714.6 521.7Q705.6 584.7 665.6 633.7Q625.6 682.7 565.6 703.7Q546.6 710.7 525.6 713.7Q517.6 714.7 499.1 715.7Q480.6 716.7 474.6 715.7ZM430.6 600.7Q451.6 586.7 474.6 572.7Q498.6 558.7 502.6 556.7Q540.6 531.7 611.6 489.7Q614.6 487.7 614.1 486.2Q613.6 484.7 592.6 472.7Q570.6 460.7 550.6 449.7Q509.6 426.7 459.6 398.7Q439.6 386.7 423.6 377.7Q407.6 368.7 406.6 368.7Q405.6 368.7 405.6 492.7V615.7L407.6 614.7Q410.6 612.7 430.6 600.7Z"></path></svg>

From the CDN

Link to the file instead of installing it: for <img>, CSS, emails and docs, with nothing added to your bundle. Served with CORS and cached for an hour.

https://icons.atmosphere.africa/svg/media/youtube-music.svg

<img src="https://icons.atmosphere.africa/svg/media/youtube-music.svg" alt="YouTube music" width="160">

import { illustrationUrl } from '@ba-icons/illustrations';

illustrationUrl('media/youtube-music');
// → https://icons.atmosphere.africa/svg/media/youtube-music.svg

As an <img> it draws in black. To give it the text colour, use it as a mask:

.mark {
  background-color: currentColor;
  mask: url('https://icons.atmosphere.africa/svg/media/youtube-music.svg') center / contain no-repeat;
}

New to the packages? Point your project at the registry first.