text edit style icon
text-edit-style-16 from Fluent UI System Color Icons by Microsoft Corporation · 16 · MIT Free for personal and commercial use.
- Name
- text-edit-style-16
- Set
- Fluent UI System Color Icons
- Style
- 16
- Viewbox
- 16×16
- License
- MIT
2 other variants in Fluent UI System Color Icons
The same icon in other sets
Related icons in Fluent UI System Color Icons
Use the text edit style icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 16 16"><g fill="none"><path fill="url(#SVGiN2SxdVI)" fill-rule="evenodd" d="M5 2a.5.5 0 0 1 .471.332l2.5 7a.5.5 0 0 1-.942.336L5 4L2.971 9.668a.5.5 0 0 1-.942-.336l2.5-7A.5.5 0 0 1 5 2" clip-rule="evenodd"/><path fill="url(#SVGiN2SxdVI)" fill-rule="evenodd" d="M6.5 7h-3V6h3z" clip-rule="evenodd"/><path fill="url(#SVGWgp93dUy)" d="m8.733 12.975l4.596-4.596l-2.707-2.707l-4.597 4.596l-.011 2.718z"/><path fill="url(#SVGjjgCSb2U)" d="M7.504 13.61a2.5 2.5 0 0 0 1.278-.684s-.912-.21-1.705-1.003a3.9 3.9 0 0 1-1.002-1.705a2.5 2.5 0 0 0-.684 1.278l-.381 1.906a.5.5 0 0 0 .588.588z"/><path fill="url(#SVGJVYe4dxV)" d="M13.44 5.562a1.915 1.915 0 0 0-2.708 0L9.61 6.681l2.707 2.708L13.44 8.27a1.915 1.915 0 0 0 0-2.707"/><path fill="url(#SVGKk5LhbHS)" d="m12.091 9.616l.884-.883s-.914-.207-1.707-1a3.9 3.9 0 0 1-1-1.708l-.884.884s.207.914 1 1.707a3.9 3.9 0 0 0 1.707 1"/><defs><linearGradient id="SVGiN2SxdVI" x1="2" x2="4.324" y1="2.471" y2="11.129" gradientUnits="userSpaceOnUse"><stop stop-color="#0fafff"/><stop offset=".677" stop-color="#0078d4"/><stop offset=".84" stop-color="#0057aa"/><stop offset="1" stop-color="#0057aa"/></linearGradient><linearGradient id="SVGWgp93dUy" x1="10.06" x2="11.178" y1="7.717" y2="10.787" gradientUnits="userSpaceOnUse"><stop stop-color="#ffa43d"/><stop offset="1" stop-color="#fb5937"/></linearGradient><linearGradient id="SVGjjgCSb2U" x1="3.909" x2="6.984" y1="11.407" y2="14.461" gradientUnits="userSpaceOnUse"><stop offset=".255" stop-color="#ffd394"/><stop offset="1" stop-color="#ff921f"/></linearGradient><linearGradient id="SVGJVYe4dxV" x1="13.229" x2="11.872" y1="5.767" y2="7.043" gradientUnits="userSpaceOnUse"><stop stop-color="#f97dbd"/><stop offset="1" stop-color="#dd3ce2"/></linearGradient><linearGradient id="SVGKk5LhbHS" x1="11.242" x2="8.704" y1="8.483" y2="7.373" gradientUnits="userSpaceOnUse"><stop stop-color="#ff921f"/><stop offset="1" stop-color="#ffe994"/></linearGradient></defs></g></svg>
React
import type { SVGProps } from "react";
export function FluentColorTextEditStyle16(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 16 16"><g fill="none"><path fill="url(#SVGiN2SxdVI)" fillRule="evenodd" d="M5 2a.5.5 0 0 1 .471.332l2.5 7a.5.5 0 0 1-.942.336L5 4L2.971 9.668a.5.5 0 0 1-.942-.336l2.5-7A.5.5 0 0 1 5 2" clipRule="evenodd"/><path fill="url(#SVGiN2SxdVI)" fillRule="evenodd" d="M6.5 7h-3V6h3z" clipRule="evenodd"/><path fill="url(#SVGWgp93dUy)" d="m8.733 12.975l4.596-4.596l-2.707-2.707l-4.597 4.596l-.011 2.718z"/><path fill="url(#SVGjjgCSb2U)" d="M7.504 13.61a2.5 2.5 0 0 0 1.278-.684s-.912-.21-1.705-1.003a3.9 3.9 0 0 1-1.002-1.705a2.5 2.5 0 0 0-.684 1.278l-.381 1.906a.5.5 0 0 0 .588.588z"/><path fill="url(#SVGJVYe4dxV)" d="M13.44 5.562a1.915 1.915 0 0 0-2.708 0L9.61 6.681l2.707 2.708L13.44 8.27a1.915 1.915 0 0 0 0-2.707"/><path fill="url(#SVGKk5LhbHS)" d="m12.091 9.616l.884-.883s-.914-.207-1.707-1a3.9 3.9 0 0 1-1-1.708l-.884.884s.207.914 1 1.707a3.9 3.9 0 0 0 1.707 1"/><defs><linearGradient id="SVGiN2SxdVI" x1="2" x2="4.324" y1="2.471" y2="11.129" gradientUnits="userSpaceOnUse"><stop stopColor="#0fafff"/><stop offset=".677" stopColor="#0078d4"/><stop offset=".84" stopColor="#0057aa"/><stop offset="1" stopColor="#0057aa"/></linearGradient><linearGradient id="SVGWgp93dUy" x1="10.06" x2="11.178" y1="7.717" y2="10.787" gradientUnits="userSpaceOnUse"><stop stopColor="#ffa43d"/><stop offset="1" stopColor="#fb5937"/></linearGradient><linearGradient id="SVGjjgCSb2U" x1="3.909" x2="6.984" y1="11.407" y2="14.461" gradientUnits="userSpaceOnUse"><stop offset=".255" stopColor="#ffd394"/><stop offset="1" stopColor="#ff921f"/></linearGradient><linearGradient id="SVGJVYe4dxV" x1="13.229" x2="11.872" y1="5.767" y2="7.043" gradientUnits="userSpaceOnUse"><stop stopColor="#f97dbd"/><stop offset="1" stopColor="#dd3ce2"/></linearGradient><linearGradient id="SVGKk5LhbHS" x1="11.242" x2="8.704" y1="8.483" y2="7.373" gradientUnits="userSpaceOnUse"><stop stopColor="#ff921f"/><stop offset="1" stopColor="#ffe994"/></linearGradient></defs></g></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 16 16"><g fill="none"><path fill="url(#SVGiN2SxdVI)" fill-rule="evenodd" d="M5 2a.5.5 0 0 1 .471.332l2.5 7a.5.5 0 0 1-.942.336L5 4L2.971 9.668a.5.5 0 0 1-.942-.336l2.5-7A.5.5 0 0 1 5 2" clip-rule="evenodd"/><path fill="url(#SVGiN2SxdVI)" fill-rule="evenodd" d="M6.5 7h-3V6h3z" clip-rule="evenodd"/><path fill="url(#SVGWgp93dUy)" d="m8.733 12.975l4.596-4.596l-2.707-2.707l-4.597 4.596l-.011 2.718z"/><path fill="url(#SVGjjgCSb2U)" d="M7.504 13.61a2.5 2.5 0 0 0 1.278-.684s-.912-.21-1.705-1.003a3.9 3.9 0 0 1-1.002-1.705a2.5 2.5 0 0 0-.684 1.278l-.381 1.906a.5.5 0 0 0 .588.588z"/><path fill="url(#SVGJVYe4dxV)" d="M13.44 5.562a1.915 1.915 0 0 0-2.708 0L9.61 6.681l2.707 2.708L13.44 8.27a1.915 1.915 0 0 0 0-2.707"/><path fill="url(#SVGKk5LhbHS)" d="m12.091 9.616l.884-.883s-.914-.207-1.707-1a3.9 3.9 0 0 1-1-1.708l-.884.884s.207.914 1 1.707a3.9 3.9 0 0 0 1.707 1"/><defs><linearGradient id="SVGiN2SxdVI" x1="2" x2="4.324" y1="2.471" y2="11.129" gradientUnits="userSpaceOnUse"><stop stop-color="#0fafff"/><stop offset=".677" stop-color="#0078d4"/><stop offset=".84" stop-color="#0057aa"/><stop offset="1" stop-color="#0057aa"/></linearGradient><linearGradient id="SVGWgp93dUy" x1="10.06" x2="11.178" y1="7.717" y2="10.787" gradientUnits="userSpaceOnUse"><stop stop-color="#ffa43d"/><stop offset="1" stop-color="#fb5937"/></linearGradient><linearGradient id="SVGjjgCSb2U" x1="3.909" x2="6.984" y1="11.407" y2="14.461" gradientUnits="userSpaceOnUse"><stop offset=".255" stop-color="#ffd394"/><stop offset="1" stop-color="#ff921f"/></linearGradient><linearGradient id="SVGJVYe4dxV" x1="13.229" x2="11.872" y1="5.767" y2="7.043" gradientUnits="userSpaceOnUse"><stop stop-color="#f97dbd"/><stop offset="1" stop-color="#dd3ce2"/></linearGradient><linearGradient id="SVGKk5LhbHS" x1="11.242" x2="8.704" y1="8.483" y2="7.373" gradientUnits="userSpaceOnUse"><stop stop-color="#ff921f"/><stop offset="1" stop-color="#ffe994"/></linearGradient></defs></g></svg> </template>
CSS
.icon-text-edit-style-16 {
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%2016%2016%22%3E%3Cg%20fill%3D%22none%22%3E%3Cpath%20fill%3D%22url(%23SVGiN2SxdVI)%22%20fill-rule%3D%22evenodd%22%20d%3D%22M5%202a.5.5%200%200%201%20.471.332l2.5%207a.5.5%200%200%201-.942.336L5%204L2.971%209.668a.5.5%200%200%201-.942-.336l2.5-7A.5.5%200%200%201%205%202%22%20clip-rule%3D%22evenodd%22%2F%3E%3Cpath%20fill%3D%22url(%23SVGiN2SxdVI)%22%20fill-rule%3D%22evenodd%22%20d%3D%22M6.5%207h-3V6h3z%22%20clip-rule%3D%22evenodd%22%2F%3E%3Cpath%20fill%3D%22url(%23SVGWgp93dUy)%22%20d%3D%22m8.733%2012.975l4.596-4.596l-2.707-2.707l-4.597%204.596l-.011%202.718z%22%2F%3E%3Cpath%20fill%3D%22url(%23SVGjjgCSb2U)%22%20d%3D%22M7.504%2013.61a2.5%202.5%200%200%200%201.278-.684s-.912-.21-1.705-1.003a3.9%203.9%200%200%201-1.002-1.705a2.5%202.5%200%200%200-.684%201.278l-.381%201.906a.5.5%200%200%200%20.588.588z%22%2F%3E%3Cpath%20fill%3D%22url(%23SVGJVYe4dxV)%22%20d%3D%22M13.44%205.562a1.915%201.915%200%200%200-2.708%200L9.61%206.681l2.707%202.708L13.44%208.27a1.915%201.915%200%200%200%200-2.707%22%2F%3E%3Cpath%20fill%3D%22url(%23SVGKk5LhbHS)%22%20d%3D%22m12.091%209.616l.884-.883s-.914-.207-1.707-1a3.9%203.9%200%200%201-1-1.708l-.884.884s.207.914%201%201.707a3.9%203.9%200%200%200%201.707%201%22%2F%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22SVGiN2SxdVI%22%20x1%3D%222%22%20x2%3D%224.324%22%20y1%3D%222.471%22%20y2%3D%2211.129%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%230fafff%22%2F%3E%3Cstop%20offset%3D%22.677%22%20stop-color%3D%22%230078d4%22%2F%3E%3Cstop%20offset%3D%22.84%22%20stop-color%3D%22%230057aa%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%230057aa%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22SVGWgp93dUy%22%20x1%3D%2210.06%22%20x2%3D%2211.178%22%20y1%3D%227.717%22%20y2%3D%2210.787%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23ffa43d%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23fb5937%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22SVGjjgCSb2U%22%20x1%3D%223.909%22%20x2%3D%226.984%22%20y1%3D%2211.407%22%20y2%3D%2214.461%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20offset%3D%22.255%22%20stop-color%3D%22%23ffd394%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23ff921f%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22SVGJVYe4dxV%22%20x1%3D%2213.229%22%20x2%3D%2211.872%22%20y1%3D%225.767%22%20y2%3D%227.043%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23f97dbd%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23dd3ce2%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22SVGKk5LhbHS%22%20x1%3D%2211.242%22%20x2%3D%228.704%22%20y1%3D%228.483%22%20y2%3D%227.373%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23ff921f%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23ffe994%22%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3C%2Fg%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%2016%2016%22%3E%3Cg%20fill%3D%22none%22%3E%3Cpath%20fill%3D%22url(%23SVGiN2SxdVI)%22%20fill-rule%3D%22evenodd%22%20d%3D%22M5%202a.5.5%200%200%201%20.471.332l2.5%207a.5.5%200%200%201-.942.336L5%204L2.971%209.668a.5.5%200%200%201-.942-.336l2.5-7A.5.5%200%200%201%205%202%22%20clip-rule%3D%22evenodd%22%2F%3E%3Cpath%20fill%3D%22url(%23SVGiN2SxdVI)%22%20fill-rule%3D%22evenodd%22%20d%3D%22M6.5%207h-3V6h3z%22%20clip-rule%3D%22evenodd%22%2F%3E%3Cpath%20fill%3D%22url(%23SVGWgp93dUy)%22%20d%3D%22m8.733%2012.975l4.596-4.596l-2.707-2.707l-4.597%204.596l-.011%202.718z%22%2F%3E%3Cpath%20fill%3D%22url(%23SVGjjgCSb2U)%22%20d%3D%22M7.504%2013.61a2.5%202.5%200%200%200%201.278-.684s-.912-.21-1.705-1.003a3.9%203.9%200%200%201-1.002-1.705a2.5%202.5%200%200%200-.684%201.278l-.381%201.906a.5.5%200%200%200%20.588.588z%22%2F%3E%3Cpath%20fill%3D%22url(%23SVGJVYe4dxV)%22%20d%3D%22M13.44%205.562a1.915%201.915%200%200%200-2.708%200L9.61%206.681l2.707%202.708L13.44%208.27a1.915%201.915%200%200%200%200-2.707%22%2F%3E%3Cpath%20fill%3D%22url(%23SVGKk5LhbHS)%22%20d%3D%22m12.091%209.616l.884-.883s-.914-.207-1.707-1a3.9%203.9%200%200%201-1-1.708l-.884.884s.207.914%201%201.707a3.9%203.9%200%200%200%201.707%201%22%2F%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22SVGiN2SxdVI%22%20x1%3D%222%22%20x2%3D%224.324%22%20y1%3D%222.471%22%20y2%3D%2211.129%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%230fafff%22%2F%3E%3Cstop%20offset%3D%22.677%22%20stop-color%3D%22%230078d4%22%2F%3E%3Cstop%20offset%3D%22.84%22%20stop-color%3D%22%230057aa%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%230057aa%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22SVGWgp93dUy%22%20x1%3D%2210.06%22%20x2%3D%2211.178%22%20y1%3D%227.717%22%20y2%3D%2210.787%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23ffa43d%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23fb5937%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22SVGjjgCSb2U%22%20x1%3D%223.909%22%20x2%3D%226.984%22%20y1%3D%2211.407%22%20y2%3D%2214.461%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20offset%3D%22.255%22%20stop-color%3D%22%23ffd394%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23ff921f%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22SVGJVYe4dxV%22%20x1%3D%2213.229%22%20x2%3D%2211.872%22%20y1%3D%225.767%22%20y2%3D%227.043%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23f97dbd%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23dd3ce2%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22SVGKk5LhbHS%22%20x1%3D%2211.242%22%20x2%3D%228.704%22%20y1%3D%228.483%22%20y2%3D%227.373%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23ff921f%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23ffe994%22%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/fluent-color/text-edit-style-16.svg?color=%231a73e8&size=48
