screencast icon

screencast-fill from Mage Icons by MageIcons · Fill · Apache-2.0 Free for personal and commercial use.

Name: screencast-fill
Set: Mage Icons
Style: Fill
Viewbox: 24×24
License: Apache 2.0

1 other variant in Mage Icons

The same icon in other sets

screencastMaterial Symbols screencastPhosphor screencast-boldSolar screencastTDesign Icons

Use the screencast icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><defs><path id="SVGfory69zG" fill="currentColor" d="M10.691 21.07a.74.74 0 0 1-.749-.748a7.193 7.193 0 0 0-7.193-7.193a.75.75 0 1 1 0-1.499a8.7 8.7 0 0 1 8.692 8.692a.75.75 0 0 1-.75.749"/></defs><path fill="currentColor" d="M4.597 21.071a.74.74 0 0 1-.749-.75a1.11 1.11 0 0 0-1.099-1.098a.75.75 0 1 1 0-1.499a2.607 2.607 0 0 1 2.598 2.598a.75.75 0 0 1-.75.749"/><path fill="currentColor" d="M7.554 21.07a.75.75 0 0 1-.749-.748a4.066 4.066 0 0 0-4.056-4.056a.75.75 0 1 1 0-1.499c.73 0 1.453.142 2.128.42a5.63 5.63 0 0 1 2.997 2.997c.278.675.42 1.398.42 2.128a.74.74 0 0 1-.74.759"/><use href="#SVGfory69zG"/><path fill="currentColor" d="M21.98 7.375v9.24a4.455 4.455 0 0 1-4.445 4.446h-3.627a.74.74 0 0 1-.74-.84a10 10 0 0 0-2.996-7.672a8.37 8.37 0 0 0-7.253-2.667a.73.73 0 0 1-.62-.15a.74.74 0 0 1-.28-.58V7.376A4.456 4.456 0 0 1 6.466 2.93h11.089A4.465 4.465 0 0 1 22 7.375z"/><use href="#SVGfory69zG"/></svg>

React

import type { SVGProps } from "react";

export function MageScreencastFill(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><defs><path id="SVGfory69zG" fill="currentColor" d="M10.691 21.07a.74.74 0 0 1-.749-.748a7.193 7.193 0 0 0-7.193-7.193a.75.75 0 1 1 0-1.499a8.7 8.7 0 0 1 8.692 8.692a.75.75 0 0 1-.75.749"/></defs><path fill="currentColor" d="M4.597 21.071a.74.74 0 0 1-.749-.75a1.11 1.11 0 0 0-1.099-1.098a.75.75 0 1 1 0-1.499a2.607 2.607 0 0 1 2.598 2.598a.75.75 0 0 1-.75.749"/><path fill="currentColor" d="M7.554 21.07a.75.75 0 0 1-.749-.748a4.066 4.066 0 0 0-4.056-4.056a.75.75 0 1 1 0-1.499c.73 0 1.453.142 2.128.42a5.63 5.63 0 0 1 2.997 2.997c.278.675.42 1.398.42 2.128a.74.74 0 0 1-.74.759"/><use href="#SVGfory69zG"/><path fill="currentColor" d="M21.98 7.375v9.24a4.455 4.455 0 0 1-4.445 4.446h-3.627a.74.74 0 0 1-.74-.84a10 10 0 0 0-2.996-7.672a8.37 8.37 0 0 0-7.253-2.667a.73.73 0 0 1-.62-.15a.74.74 0 0 1-.28-.58V7.376A4.456 4.456 0 0 1 6.466 2.93h11.089A4.465 4.465 0 0 1 22 7.375z"/><use href="#SVGfory69zG"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><defs><path id="SVGfory69zG" fill="currentColor" d="M10.691 21.07a.74.74 0 0 1-.749-.748a7.193 7.193 0 0 0-7.193-7.193a.75.75 0 1 1 0-1.499a8.7 8.7 0 0 1 8.692 8.692a.75.75 0 0 1-.75.749"/></defs><path fill="currentColor" d="M4.597 21.071a.74.74 0 0 1-.749-.75a1.11 1.11 0 0 0-1.099-1.098a.75.75 0 1 1 0-1.499a2.607 2.607 0 0 1 2.598 2.598a.75.75 0 0 1-.75.749"/><path fill="currentColor" d="M7.554 21.07a.75.75 0 0 1-.749-.748a4.066 4.066 0 0 0-4.056-4.056a.75.75 0 1 1 0-1.499c.73 0 1.453.142 2.128.42a5.63 5.63 0 0 1 2.997 2.997c.278.675.42 1.398.42 2.128a.74.74 0 0 1-.74.759"/><use href="#SVGfory69zG"/><path fill="currentColor" d="M21.98 7.375v9.24a4.455 4.455 0 0 1-4.445 4.446h-3.627a.74.74 0 0 1-.74-.84a10 10 0 0 0-2.996-7.672a8.37 8.37 0 0 0-7.253-2.667a.73.73 0 0 1-.62-.15a.74.74 0 0 1-.28-.58V7.376A4.456 4.456 0 0 1 6.466 2.93h11.089A4.465 4.465 0 0 1 22 7.375z"/><use href="#SVGfory69zG"/></svg>
</template>

CSS

.icon-screencast-fill {
  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%2024%2024%22%3E%3Cdefs%3E%3Cpath%20id%3D%22SVGfory69zG%22%20fill%3D%22currentColor%22%20d%3D%22M10.691%2021.07a.74.74%200%200%201-.749-.748a7.193%207.193%200%200%200-7.193-7.193a.75.75%200%201%201%200-1.499a8.7%208.7%200%200%201%208.692%208.692a.75.75%200%200%201-.75.749%22%2F%3E%3C%2Fdefs%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M4.597%2021.071a.74.74%200%200%201-.749-.75a1.11%201.11%200%200%200-1.099-1.098a.75.75%200%201%201%200-1.499a2.607%202.607%200%200%201%202.598%202.598a.75.75%200%200%201-.75.749%22%2F%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M7.554%2021.07a.75.75%200%200%201-.749-.748a4.066%204.066%200%200%200-4.056-4.056a.75.75%200%201%201%200-1.499c.73%200%201.453.142%202.128.42a5.63%205.63%200%200%201%202.997%202.997c.278.675.42%201.398.42%202.128a.74.74%200%200%201-.74.759%22%2F%3E%3Cuse%20href%3D%22%23SVGfory69zG%22%2F%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M21.98%207.375v9.24a4.455%204.455%200%200%201-4.445%204.446h-3.627a.74.74%200%200%201-.74-.84a10%2010%200%200%200-2.996-7.672a8.37%208.37%200%200%200-7.253-2.667a.73.73%200%200%201-.62-.15a.74.74%200%200%201-.28-.58V7.376A4.456%204.456%200%200%201%206.466%202.93h11.089A4.465%204.465%200%200%201%2022%207.375z%22%2F%3E%3Cuse%20href%3D%22%23SVGfory69zG%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%2024%2024%22%3E%3Cdefs%3E%3Cpath%20id%3D%22SVGfory69zG%22%20fill%3D%22currentColor%22%20d%3D%22M10.691%2021.07a.74.74%200%200%201-.749-.748a7.193%207.193%200%200%200-7.193-7.193a.75.75%200%201%201%200-1.499a8.7%208.7%200%200%201%208.692%208.692a.75.75%200%200%201-.75.749%22%2F%3E%3C%2Fdefs%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M4.597%2021.071a.74.74%200%200%201-.749-.75a1.11%201.11%200%200%200-1.099-1.098a.75.75%200%201%201%200-1.499a2.607%202.607%200%200%201%202.598%202.598a.75.75%200%200%201-.75.749%22%2F%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M7.554%2021.07a.75.75%200%200%201-.749-.748a4.066%204.066%200%200%200-4.056-4.056a.75.75%200%201%201%200-1.499c.73%200%201.453.142%202.128.42a5.63%205.63%200%200%201%202.997%202.997c.278.675.42%201.398.42%202.128a.74.74%200%200%201-.74.759%22%2F%3E%3Cuse%20href%3D%22%23SVGfory69zG%22%2F%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M21.98%207.375v9.24a4.455%204.455%200%200%201-4.445%204.446h-3.627a.74.74%200%200%201-.74-.84a10%2010%200%200%200-2.996-7.672a8.37%208.37%200%200%200-7.253-2.667a.73.73%200%200%201-.62-.15a.74.74%200%200%201-.28-.58V7.376A4.456%204.456%200%200%201%206.466%202.93h11.089A4.465%204.465%200%200%201%2022%207.375z%22%2F%3E%3Cuse%20href%3D%22%23SVGfory69zG%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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