link icon
link from Phosphor by Phosphor Icons · Regular · MIT Free for personal and commercial use.
- Name
- link
- Set
- Phosphor
- Style
- Regular
- Viewbox
- 256×256
- License
- MIT
5 other variants in Phosphor
The same icon in other sets
linkBootstrap IconslinkBoxIcons v2linkCarbonlinkEmoji One (Colored)link-fillEva IconslinkFramework7 IconslinkFont Awesome 6 SolidlinkFeather Iconslink-12-filledFluent UI System IconslinkFluent EmojilinkFluent Emoji FlatlinkFluent Emoji High Contrastlinkcss.gglinkHeroIconslinkHuge IconslinkHumbleiconslinkIconoirlinkIonIconslinkJam IconslinkLine AwesomelinkMaterial Line IconslinkLucidelinkMage IconslinkMajesticons
Related icons in Phosphor
Use the link icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M240 88.23a54.43 54.43 0 0 1-16 37L189.25 160a54.27 54.27 0 0 1-38.63 16h-.05A54.63 54.63 0 0 1 96 119.84a8 8 0 0 1 16 .45A38.62 38.62 0 0 0 150.58 160a38.4 38.4 0 0 0 27.31-11.31l34.75-34.75a38.63 38.63 0 0 0-54.63-54.63l-11 11A8 8 0 0 1 135.7 59l11-11a54.65 54.65 0 0 1 77.3 0a54.86 54.86 0 0 1 16 40.23m-131 97.43l-11 11A38.4 38.4 0 0 1 70.6 208a38.63 38.63 0 0 1-27.29-65.94L78 107.31a38.63 38.63 0 0 1 66 28.4a8 8 0 0 0 16 .45A54.86 54.86 0 0 0 144 96a54.65 54.65 0 0 0-77.27 0L32 130.75A54.62 54.62 0 0 0 70.56 224a54.28 54.28 0 0 0 38.64-16l11-11a8 8 0 0 0-11.2-11.34"/></svg>
React
import type { SVGProps } from "react";
export function PhLink(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M240 88.23a54.43 54.43 0 0 1-16 37L189.25 160a54.27 54.27 0 0 1-38.63 16h-.05A54.63 54.63 0 0 1 96 119.84a8 8 0 0 1 16 .45A38.62 38.62 0 0 0 150.58 160a38.4 38.4 0 0 0 27.31-11.31l34.75-34.75a38.63 38.63 0 0 0-54.63-54.63l-11 11A8 8 0 0 1 135.7 59l11-11a54.65 54.65 0 0 1 77.3 0a54.86 54.86 0 0 1 16 40.23m-131 97.43l-11 11A38.4 38.4 0 0 1 70.6 208a38.63 38.63 0 0 1-27.29-65.94L78 107.31a38.63 38.63 0 0 1 66 28.4a8 8 0 0 0 16 .45A54.86 54.86 0 0 0 144 96a54.65 54.65 0 0 0-77.27 0L32 130.75A54.62 54.62 0 0 0 70.56 224a54.28 54.28 0 0 0 38.64-16l11-11a8 8 0 0 0-11.2-11.34"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M240 88.23a54.43 54.43 0 0 1-16 37L189.25 160a54.27 54.27 0 0 1-38.63 16h-.05A54.63 54.63 0 0 1 96 119.84a8 8 0 0 1 16 .45A38.62 38.62 0 0 0 150.58 160a38.4 38.4 0 0 0 27.31-11.31l34.75-34.75a38.63 38.63 0 0 0-54.63-54.63l-11 11A8 8 0 0 1 135.7 59l11-11a54.65 54.65 0 0 1 77.3 0a54.86 54.86 0 0 1 16 40.23m-131 97.43l-11 11A38.4 38.4 0 0 1 70.6 208a38.63 38.63 0 0 1-27.29-65.94L78 107.31a38.63 38.63 0 0 1 66 28.4a8 8 0 0 0 16 .45A54.86 54.86 0 0 0 144 96a54.65 54.65 0 0 0-77.27 0L32 130.75A54.62 54.62 0 0 0 70.56 224a54.28 54.28 0 0 0 38.64-16l11-11a8 8 0 0 0-11.2-11.34"/></svg> </template>
CSS
.icon-link {
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%20256%20256%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M240%2088.23a54.43%2054.43%200%200%201-16%2037L189.25%20160a54.27%2054.27%200%200%201-38.63%2016h-.05A54.63%2054.63%200%200%201%2096%20119.84a8%208%200%200%201%2016%20.45A38.62%2038.62%200%200%200%20150.58%20160a38.4%2038.4%200%200%200%2027.31-11.31l34.75-34.75a38.63%2038.63%200%200%200-54.63-54.63l-11%2011A8%208%200%200%201%20135.7%2059l11-11a54.65%2054.65%200%200%201%2077.3%200a54.86%2054.86%200%200%201%2016%2040.23m-131%2097.43l-11%2011A38.4%2038.4%200%200%201%2070.6%20208a38.63%2038.63%200%200%201-27.29-65.94L78%20107.31a38.63%2038.63%200%200%201%2066%2028.4a8%208%200%200%200%2016%20.45A54.86%2054.86%200%200%200%20144%2096a54.65%2054.65%200%200%200-77.27%200L32%20130.75A54.62%2054.62%200%200%200%2070.56%20224a54.28%2054.28%200%200%200%2038.64-16l11-11a8%208%200%200%200-11.2-11.34%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%20256%20256%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M240%2088.23a54.43%2054.43%200%200%201-16%2037L189.25%20160a54.27%2054.27%200%200%201-38.63%2016h-.05A54.63%2054.63%200%200%201%2096%20119.84a8%208%200%200%201%2016%20.45A38.62%2038.62%200%200%200%20150.58%20160a38.4%2038.4%200%200%200%2027.31-11.31l34.75-34.75a38.63%2038.63%200%200%200-54.63-54.63l-11%2011A8%208%200%200%201%20135.7%2059l11-11a54.65%2054.65%200%200%201%2077.3%200a54.86%2054.86%200%200%201%2016%2040.23m-131%2097.43l-11%2011A38.4%2038.4%200%200%201%2070.6%20208a38.63%2038.63%200%200%201-27.29-65.94L78%20107.31a38.63%2038.63%200%200%201%2066%2028.4a8%208%200%200%200%2016%20.45A54.86%2054.86%200%200%200%20144%2096a54.65%2054.65%200%200%200-77.27%200L32%20130.75A54.62%2054.62%200%200%200%2070.56%20224a54.28%2054.28%200%200%200%2038.64-16l11-11a8%208%200%200%200-11.2-11.34%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/ph/link.svg?color=%231a73e8&size=48
