diamond link icon
diamond-link-20-filled from Fluent UI System Icons by Microsoft Corporation · 20 Filled · MIT Free for personal and commercial use.
- Name
- diamond-link-20-filled
- Set
- Fluent UI System Icons
- Style
- 20 Filled
- Viewbox
- 20×20
- License
- MIT
11 other variants in Fluent UI System Icons
Related icons in Fluent UI System Icons
Use the diamond link icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 20 20"><path fill="currentColor" d="M8.66 5.425a6.746 6.746 0 0 1 3.991 11.468l-.002.002l-.887.883a2.5 2.5 0 0 1-3.531-.004l-6.003-6.002a2.5 2.5 0 0 1 .003-3.538l.88-.88A6.8 6.8 0 0 1 4.55 6.258a7.8 7.8 0 0 0-.167 1.956a5 5 0 0 0-.211.2l-.883.882c-.39.39-.39 1.025 0 1.415l6.002 6.003a1 1 0 0 0 1.412 0l.886-.881a5.246 5.246 0 0 0 .001-7.418A5.23 5.23 0 0 0 7.994 6.88a4.2 4.2 0 0 1 .665-1.456m-.433-3.19a2.5 2.5 0 0 1 3.537-.001l6.002 6.002a2.5 2.5 0 0 1 .005 3.531l-.88.884l-.002.002a6.8 6.8 0 0 1-1.438 1.094a7.8 7.8 0 0 0 .165-1.957q.109-.096.211-.198l.88-.882a1 1 0 0 0-.002-1.414l-6.002-6.002a1 1 0 0 0-1.415.001l-.878.88a5.247 5.247 0 0 0 0 7.417a5.23 5.23 0 0 0 3.594 1.533a4.2 4.2 0 0 1-.665 1.456a6.7 6.7 0 0 1-3.99-1.928a6.746 6.746 0 0 1 0-9.538z"/></svg>
React
import type { SVGProps } from "react";
export function FluentDiamondLink20Filled(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="M8.66 5.425a6.746 6.746 0 0 1 3.991 11.468l-.002.002l-.887.883a2.5 2.5 0 0 1-3.531-.004l-6.003-6.002a2.5 2.5 0 0 1 .003-3.538l.88-.88A6.8 6.8 0 0 1 4.55 6.258a7.8 7.8 0 0 0-.167 1.956a5 5 0 0 0-.211.2l-.883.882c-.39.39-.39 1.025 0 1.415l6.002 6.003a1 1 0 0 0 1.412 0l.886-.881a5.246 5.246 0 0 0 .001-7.418A5.23 5.23 0 0 0 7.994 6.88a4.2 4.2 0 0 1 .665-1.456m-.433-3.19a2.5 2.5 0 0 1 3.537-.001l6.002 6.002a2.5 2.5 0 0 1 .005 3.531l-.88.884l-.002.002a6.8 6.8 0 0 1-1.438 1.094a7.8 7.8 0 0 0 .165-1.957q.109-.096.211-.198l.88-.882a1 1 0 0 0-.002-1.414l-6.002-6.002a1 1 0 0 0-1.415.001l-.878.88a5.247 5.247 0 0 0 0 7.417a5.23 5.23 0 0 0 3.594 1.533a4.2 4.2 0 0 1-.665 1.456a6.7 6.7 0 0 1-3.99-1.928a6.746 6.746 0 0 1 0-9.538z"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 20 20"><path fill="currentColor" d="M8.66 5.425a6.746 6.746 0 0 1 3.991 11.468l-.002.002l-.887.883a2.5 2.5 0 0 1-3.531-.004l-6.003-6.002a2.5 2.5 0 0 1 .003-3.538l.88-.88A6.8 6.8 0 0 1 4.55 6.258a7.8 7.8 0 0 0-.167 1.956a5 5 0 0 0-.211.2l-.883.882c-.39.39-.39 1.025 0 1.415l6.002 6.003a1 1 0 0 0 1.412 0l.886-.881a5.246 5.246 0 0 0 .001-7.418A5.23 5.23 0 0 0 7.994 6.88a4.2 4.2 0 0 1 .665-1.456m-.433-3.19a2.5 2.5 0 0 1 3.537-.001l6.002 6.002a2.5 2.5 0 0 1 .005 3.531l-.88.884l-.002.002a6.8 6.8 0 0 1-1.438 1.094a7.8 7.8 0 0 0 .165-1.957q.109-.096.211-.198l.88-.882a1 1 0 0 0-.002-1.414l-6.002-6.002a1 1 0 0 0-1.415.001l-.878.88a5.247 5.247 0 0 0 0 7.417a5.23 5.23 0 0 0 3.594 1.533a4.2 4.2 0 0 1-.665 1.456a6.7 6.7 0 0 1-3.99-1.928a6.746 6.746 0 0 1 0-9.538z"/></svg> </template>
CSS
.icon-diamond-link-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%22M8.66%205.425a6.746%206.746%200%200%201%203.991%2011.468l-.002.002l-.887.883a2.5%202.5%200%200%201-3.531-.004l-6.003-6.002a2.5%202.5%200%200%201%20.003-3.538l.88-.88A6.8%206.8%200%200%201%204.55%206.258a7.8%207.8%200%200%200-.167%201.956a5%205%200%200%200-.211.2l-.883.882c-.39.39-.39%201.025%200%201.415l6.002%206.003a1%201%200%200%200%201.412%200l.886-.881a5.246%205.246%200%200%200%20.001-7.418A5.23%205.23%200%200%200%207.994%206.88a4.2%204.2%200%200%201%20.665-1.456m-.433-3.19a2.5%202.5%200%200%201%203.537-.001l6.002%206.002a2.5%202.5%200%200%201%20.005%203.531l-.88.884l-.002.002a6.8%206.8%200%200%201-1.438%201.094a7.8%207.8%200%200%200%20.165-1.957q.109-.096.211-.198l.88-.882a1%201%200%200%200-.002-1.414l-6.002-6.002a1%201%200%200%200-1.415.001l-.878.88a5.247%205.247%200%200%200%200%207.417a5.23%205.23%200%200%200%203.594%201.533a4.2%204.2%200%200%201-.665%201.456a6.7%206.7%200%200%201-3.99-1.928a6.746%206.746%200%200%201%200-9.538z%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%22M8.66%205.425a6.746%206.746%200%200%201%203.991%2011.468l-.002.002l-.887.883a2.5%202.5%200%200%201-3.531-.004l-6.003-6.002a2.5%202.5%200%200%201%20.003-3.538l.88-.88A6.8%206.8%200%200%201%204.55%206.258a7.8%207.8%200%200%200-.167%201.956a5%205%200%200%200-.211.2l-.883.882c-.39.39-.39%201.025%200%201.415l6.002%206.003a1%201%200%200%200%201.412%200l.886-.881a5.246%205.246%200%200%200%20.001-7.418A5.23%205.23%200%200%200%207.994%206.88a4.2%204.2%200%200%201%20.665-1.456m-.433-3.19a2.5%202.5%200%200%201%203.537-.001l6.002%206.002a2.5%202.5%200%200%201%20.005%203.531l-.88.884l-.002.002a6.8%206.8%200%200%201-1.438%201.094a7.8%207.8%200%200%200%20.165-1.957q.109-.096.211-.198l.88-.882a1%201%200%200%200-.002-1.414l-6.002-6.002a1%201%200%200%200-1.415.001l-.878.88a5.247%205.247%200%200%200%200%207.417a5.23%205.23%200%200%200%203.594%201.533a4.2%204.2%200%200%201-.665%201.456a6.7%206.7%200%200%201-3.99-1.928a6.746%206.746%200%200%201%200-9.538z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/fluent/diamond-link-20-filled.svg?color=%231a73e8&size=48