teaching-20-filled from Fluent UI System Icons by Microsoft Corporation · 20 Filled · MIT Free for personal and commercial use.

Name
teaching-20-filled
Set
Fluent UI System Icons
Style
20 Filled
Viewbox
20×20
License
MIT

11 other variants in Fluent UI System Icons

The same icon in other sets

Use the teaching icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 20 20"><path fill="currentColor" d="M5 2a2 2 0 0 0-2 2v1h-.5a.5.5 0 0 0 0 1H3v3h-.5a.5.5 0 0 0 0 1H3v3h-.5a.5.5 0 0 0 0 1H3v1a2 2 0 0 0 2 2h3.044a10 10 0 0 1-.464-1H5a1 1 0 0 1-1-1v-1h.5a.5.5 0 0 0 0-1H4v-3h.5a.5.5 0 0 0 0-1H4V6h.5a.5.5 0 0 0 0-1H4V4a1 1 0 0 1 1-1h7a1 1 0 0 1 1 1v1.733q.264.174.5.383q.234-.234.5-.439V4a2 2 0 0 0-2-2zm10.947 4.276a.5.5 0 0 0-.67-.223a4.1 4.1 0 0 0-1.745 1.659A3.45 3.45 0 0 0 10.552 6h-.346a.706.706 0 0 0-.706.706v.347c0 .992.42 1.887 1.09 2.516C9.323 9.854 8 11.022 8 13.079c0 2.45 1.453 4.433 2.19 5.286c.375.435.914.635 1.444.635h.041c.57 0 1.114-.242 1.496-.665l.09-.1a1 1 0 0 1 .1-.092c.079-.06.2-.06.278 0a1 1 0 0 1 .1.092l.09.1c.382.423.925.665 1.496.665h.04c.53 0 1.07-.2 1.446-.635c.736-.853 2.189-2.836 2.189-5.286C19 10.69 17.217 9.5 15.806 9.5a4 4 0 0 0-1.553.299q-.134.056-.253.098v-.16c0-1.182.667-2.262 1.724-2.79a.5.5 0 0 0 .223-.67m-5.447.777V7h.053A2.447 2.447 0 0 1 13 9.447c0 .03-.024.053-.053.053A2.447 2.447 0 0 1 10.5 7.053m1.197 4.723a.5.5 0 0 1-.223.671c-.399.2-.62.635-.547 1.074l.066.397a.5.5 0 1 1-.986.164l-.066-.397a2.01 2.01 0 0 1 1.085-2.132a.5.5 0 0 1 .671.223"/></svg>

React

import type { SVGProps } from "react";

export function FluentTeaching20Filled(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 20 20"><path fill="currentColor" d="M5 2a2 2 0 0 0-2 2v1h-.5a.5.5 0 0 0 0 1H3v3h-.5a.5.5 0 0 0 0 1H3v3h-.5a.5.5 0 0 0 0 1H3v1a2 2 0 0 0 2 2h3.044a10 10 0 0 1-.464-1H5a1 1 0 0 1-1-1v-1h.5a.5.5 0 0 0 0-1H4v-3h.5a.5.5 0 0 0 0-1H4V6h.5a.5.5 0 0 0 0-1H4V4a1 1 0 0 1 1-1h7a1 1 0 0 1 1 1v1.733q.264.174.5.383q.234-.234.5-.439V4a2 2 0 0 0-2-2zm10.947 4.276a.5.5 0 0 0-.67-.223a4.1 4.1 0 0 0-1.745 1.659A3.45 3.45 0 0 0 10.552 6h-.346a.706.706 0 0 0-.706.706v.347c0 .992.42 1.887 1.09 2.516C9.323 9.854 8 11.022 8 13.079c0 2.45 1.453 4.433 2.19 5.286c.375.435.914.635 1.444.635h.041c.57 0 1.114-.242 1.496-.665l.09-.1a1 1 0 0 1 .1-.092c.079-.06.2-.06.278 0a1 1 0 0 1 .1.092l.09.1c.382.423.925.665 1.496.665h.04c.53 0 1.07-.2 1.446-.635c.736-.853 2.189-2.836 2.189-5.286C19 10.69 17.217 9.5 15.806 9.5a4 4 0 0 0-1.553.299q-.134.056-.253.098v-.16c0-1.182.667-2.262 1.724-2.79a.5.5 0 0 0 .223-.67m-5.447.777V7h.053A2.447 2.447 0 0 1 13 9.447c0 .03-.024.053-.053.053A2.447 2.447 0 0 1 10.5 7.053m1.197 4.723a.5.5 0 0 1-.223.671c-.399.2-.62.635-.547 1.074l.066.397a.5.5 0 1 1-.986.164l-.066-.397a2.01 2.01 0 0 1 1.085-2.132a.5.5 0 0 1 .671.223"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 20 20"><path fill="currentColor" d="M5 2a2 2 0 0 0-2 2v1h-.5a.5.5 0 0 0 0 1H3v3h-.5a.5.5 0 0 0 0 1H3v3h-.5a.5.5 0 0 0 0 1H3v1a2 2 0 0 0 2 2h3.044a10 10 0 0 1-.464-1H5a1 1 0 0 1-1-1v-1h.5a.5.5 0 0 0 0-1H4v-3h.5a.5.5 0 0 0 0-1H4V6h.5a.5.5 0 0 0 0-1H4V4a1 1 0 0 1 1-1h7a1 1 0 0 1 1 1v1.733q.264.174.5.383q.234-.234.5-.439V4a2 2 0 0 0-2-2zm10.947 4.276a.5.5 0 0 0-.67-.223a4.1 4.1 0 0 0-1.745 1.659A3.45 3.45 0 0 0 10.552 6h-.346a.706.706 0 0 0-.706.706v.347c0 .992.42 1.887 1.09 2.516C9.323 9.854 8 11.022 8 13.079c0 2.45 1.453 4.433 2.19 5.286c.375.435.914.635 1.444.635h.041c.57 0 1.114-.242 1.496-.665l.09-.1a1 1 0 0 1 .1-.092c.079-.06.2-.06.278 0a1 1 0 0 1 .1.092l.09.1c.382.423.925.665 1.496.665h.04c.53 0 1.07-.2 1.446-.635c.736-.853 2.189-2.836 2.189-5.286C19 10.69 17.217 9.5 15.806 9.5a4 4 0 0 0-1.553.299q-.134.056-.253.098v-.16c0-1.182.667-2.262 1.724-2.79a.5.5 0 0 0 .223-.67m-5.447.777V7h.053A2.447 2.447 0 0 1 13 9.447c0 .03-.024.053-.053.053A2.447 2.447 0 0 1 10.5 7.053m1.197 4.723a.5.5 0 0 1-.223.671c-.399.2-.62.635-.547 1.074l.066.397a.5.5 0 1 1-.986.164l-.066-.397a2.01 2.01 0 0 1 1.085-2.132a.5.5 0 0 1 .671.223"/></svg>
</template>

CSS

.icon-teaching-20-filled {
  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%2020%2020%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M5%202a2%202%200%200%200-2%202v1h-.5a.5.5%200%200%200%200%201H3v3h-.5a.5.5%200%200%200%200%201H3v3h-.5a.5.5%200%200%200%200%201H3v1a2%202%200%200%200%202%202h3.044a10%2010%200%200%201-.464-1H5a1%201%200%200%201-1-1v-1h.5a.5.5%200%200%200%200-1H4v-3h.5a.5.5%200%200%200%200-1H4V6h.5a.5.5%200%200%200%200-1H4V4a1%201%200%200%201%201-1h7a1%201%200%200%201%201%201v1.733q.264.174.5.383q.234-.234.5-.439V4a2%202%200%200%200-2-2zm10.947%204.276a.5.5%200%200%200-.67-.223a4.1%204.1%200%200%200-1.745%201.659A3.45%203.45%200%200%200%2010.552%206h-.346a.706.706%200%200%200-.706.706v.347c0%20.992.42%201.887%201.09%202.516C9.323%209.854%208%2011.022%208%2013.079c0%202.45%201.453%204.433%202.19%205.286c.375.435.914.635%201.444.635h.041c.57%200%201.114-.242%201.496-.665l.09-.1a1%201%200%200%201%20.1-.092c.079-.06.2-.06.278%200a1%201%200%200%201%20.1.092l.09.1c.382.423.925.665%201.496.665h.04c.53%200%201.07-.2%201.446-.635c.736-.853%202.189-2.836%202.189-5.286C19%2010.69%2017.217%209.5%2015.806%209.5a4%204%200%200%200-1.553.299q-.134.056-.253.098v-.16c0-1.182.667-2.262%201.724-2.79a.5.5%200%200%200%20.223-.67m-5.447.777V7h.053A2.447%202.447%200%200%201%2013%209.447c0%20.03-.024.053-.053.053A2.447%202.447%200%200%201%2010.5%207.053m1.197%204.723a.5.5%200%200%201-.223.671c-.399.2-.62.635-.547%201.074l.066.397a.5.5%200%201%201-.986.164l-.066-.397a2.01%202.01%200%200%201%201.085-2.132a.5.5%200%200%201%20.671.223%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%2020%2020%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M5%202a2%202%200%200%200-2%202v1h-.5a.5.5%200%200%200%200%201H3v3h-.5a.5.5%200%200%200%200%201H3v3h-.5a.5.5%200%200%200%200%201H3v1a2%202%200%200%200%202%202h3.044a10%2010%200%200%201-.464-1H5a1%201%200%200%201-1-1v-1h.5a.5.5%200%200%200%200-1H4v-3h.5a.5.5%200%200%200%200-1H4V6h.5a.5.5%200%200%200%200-1H4V4a1%201%200%200%201%201-1h7a1%201%200%200%201%201%201v1.733q.264.174.5.383q.234-.234.5-.439V4a2%202%200%200%200-2-2zm10.947%204.276a.5.5%200%200%200-.67-.223a4.1%204.1%200%200%200-1.745%201.659A3.45%203.45%200%200%200%2010.552%206h-.346a.706.706%200%200%200-.706.706v.347c0%20.992.42%201.887%201.09%202.516C9.323%209.854%208%2011.022%208%2013.079c0%202.45%201.453%204.433%202.19%205.286c.375.435.914.635%201.444.635h.041c.57%200%201.114-.242%201.496-.665l.09-.1a1%201%200%200%201%20.1-.092c.079-.06.2-.06.278%200a1%201%200%200%201%20.1.092l.09.1c.382.423.925.665%201.496.665h.04c.53%200%201.07-.2%201.446-.635c.736-.853%202.189-2.836%202.189-5.286C19%2010.69%2017.217%209.5%2015.806%209.5a4%204%200%200%200-1.553.299q-.134.056-.253.098v-.16c0-1.182.667-2.262%201.724-2.79a.5.5%200%200%200%20.223-.67m-5.447.777V7h.053A2.447%202.447%200%200%201%2013%209.447c0%20.03-.024.053-.053.053A2.447%202.447%200%200%201%2010.5%207.053m1.197%204.723a.5.5%200%200%201-.223.671c-.399.2-.62.635-.547%201.074l.066.397a.5.5%200%201%201-.986.164l-.066-.397a2.01%202.01%200%200%201%201.085-2.132a.5.5%200%200%201%20.671.223%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/fluent/teaching-20-filled.svg?color=%231a73e8&size=48