paperclip icon
paperclip-16 from Octicons by GitHub · 16 · MIT Free for personal and commercial use.
- Name
- paperclip-16
- Set
- Octicons
- Style
- 16
- Viewbox
- 16×16
- License
- MIT
1 other variant in Octicons
The same icon in other sets
paperclipBootstrap IconspaperclipBoxIcons v2paperclipEmoji One (Colored)paperclipElement PluspaperclipFramework7 IconspaperclipFont Awesome 6 SolidpaperclipFont Awesome SolidpaperclipFeather IconspaperclipFluent EmojipaperclipFluent Emoji FlatpaperclipFluent Emoji High ContrastpaperclipFirefox OS EmojipaperclipHuge IconspaperclipHumbleiconspaperclipIconParkpaperclipIconPark OutlinepaperclipIonIconspaperclipLine AwesomepaperclipLucidepaperclipMaterial Design IconspaperclipMyna UI IconspaperclipNoto EmojipaperclipOpenMojipaperclipPhosphor
Use the paperclip icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 16 16"><path fill="currentColor" d="M12.212 3.02a1.753 1.753 0 0 0-2.478.003l-5.83 5.83a3 3 0 0 0-.88 2.127c0 .795.315 1.551.88 2.116c.567.567 1.333.89 2.126.89c.79 0 1.548-.321 2.116-.89l5.48-5.48a.75.75 0 0 1 1.061 1.06l-5.48 5.48a4.5 4.5 0 0 1-3.177 1.33c-1.2 0-2.345-.487-3.187-1.33a4.48 4.48 0 0 1-1.32-3.177c0-1.195.475-2.341 1.32-3.186l5.83-5.83a3.25 3.25 0 0 1 5.553 2.297c0 .863-.343 1.691-.953 2.301L7.439 12.39c-.375.377-.884.59-1.416.593a2 2 0 0 1-1.412-.593a1.99 1.99 0 0 1 0-2.828l5.48-5.48a.75.75 0 0 1 1.042.018a.75.75 0 0 1 .018 1.042l-5.48 5.48a.49.49 0 0 0 0 .707a.5.5 0 0 0 .352.154a.5.5 0 0 0 .356-.154l5.833-5.827a1.755 1.755 0 0 0 0-2.481Z"/></svg>
React
import type { SVGProps } from "react";
export function OcticonPaperclip16(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 16 16"><path fill="currentColor" d="M12.212 3.02a1.753 1.753 0 0 0-2.478.003l-5.83 5.83a3 3 0 0 0-.88 2.127c0 .795.315 1.551.88 2.116c.567.567 1.333.89 2.126.89c.79 0 1.548-.321 2.116-.89l5.48-5.48a.75.75 0 0 1 1.061 1.06l-5.48 5.48a4.5 4.5 0 0 1-3.177 1.33c-1.2 0-2.345-.487-3.187-1.33a4.48 4.48 0 0 1-1.32-3.177c0-1.195.475-2.341 1.32-3.186l5.83-5.83a3.25 3.25 0 0 1 5.553 2.297c0 .863-.343 1.691-.953 2.301L7.439 12.39c-.375.377-.884.59-1.416.593a2 2 0 0 1-1.412-.593a1.99 1.99 0 0 1 0-2.828l5.48-5.48a.75.75 0 0 1 1.042.018a.75.75 0 0 1 .018 1.042l-5.48 5.48a.49.49 0 0 0 0 .707a.5.5 0 0 0 .352.154a.5.5 0 0 0 .356-.154l5.833-5.827a1.755 1.755 0 0 0 0-2.481Z"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 16 16"><path fill="currentColor" d="M12.212 3.02a1.753 1.753 0 0 0-2.478.003l-5.83 5.83a3 3 0 0 0-.88 2.127c0 .795.315 1.551.88 2.116c.567.567 1.333.89 2.126.89c.79 0 1.548-.321 2.116-.89l5.48-5.48a.75.75 0 0 1 1.061 1.06l-5.48 5.48a4.5 4.5 0 0 1-3.177 1.33c-1.2 0-2.345-.487-3.187-1.33a4.48 4.48 0 0 1-1.32-3.177c0-1.195.475-2.341 1.32-3.186l5.83-5.83a3.25 3.25 0 0 1 5.553 2.297c0 .863-.343 1.691-.953 2.301L7.439 12.39c-.375.377-.884.59-1.416.593a2 2 0 0 1-1.412-.593a1.99 1.99 0 0 1 0-2.828l5.48-5.48a.75.75 0 0 1 1.042.018a.75.75 0 0 1 .018 1.042l-5.48 5.48a.49.49 0 0 0 0 .707a.5.5 0 0 0 .352.154a.5.5 0 0 0 .356-.154l5.833-5.827a1.755 1.755 0 0 0 0-2.481Z"/></svg> </template>
CSS
.icon-paperclip-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%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M12.212%203.02a1.753%201.753%200%200%200-2.478.003l-5.83%205.83a3%203%200%200%200-.88%202.127c0%20.795.315%201.551.88%202.116c.567.567%201.333.89%202.126.89c.79%200%201.548-.321%202.116-.89l5.48-5.48a.75.75%200%200%201%201.061%201.06l-5.48%205.48a4.5%204.5%200%200%201-3.177%201.33c-1.2%200-2.345-.487-3.187-1.33a4.48%204.48%200%200%201-1.32-3.177c0-1.195.475-2.341%201.32-3.186l5.83-5.83a3.25%203.25%200%200%201%205.553%202.297c0%20.863-.343%201.691-.953%202.301L7.439%2012.39c-.375.377-.884.59-1.416.593a2%202%200%200%201-1.412-.593a1.99%201.99%200%200%201%200-2.828l5.48-5.48a.75.75%200%200%201%201.042.018a.75.75%200%200%201%20.018%201.042l-5.48%205.48a.49.49%200%200%200%200%20.707a.5.5%200%200%200%20.352.154a.5.5%200%200%200%20.356-.154l5.833-5.827a1.755%201.755%200%200%200%200-2.481Z%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%2016%2016%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M12.212%203.02a1.753%201.753%200%200%200-2.478.003l-5.83%205.83a3%203%200%200%200-.88%202.127c0%20.795.315%201.551.88%202.116c.567.567%201.333.89%202.126.89c.79%200%201.548-.321%202.116-.89l5.48-5.48a.75.75%200%200%201%201.061%201.06l-5.48%205.48a4.5%204.5%200%200%201-3.177%201.33c-1.2%200-2.345-.487-3.187-1.33a4.48%204.48%200%200%201-1.32-3.177c0-1.195.475-2.341%201.32-3.186l5.83-5.83a3.25%203.25%200%200%201%205.553%202.297c0%20.863-.343%201.691-.953%202.301L7.439%2012.39c-.375.377-.884.59-1.416.593a2%202%200%200%201-1.412-.593a1.99%201.99%200%200%201%200-2.828l5.48-5.48a.75.75%200%200%201%201.042.018a.75.75%200%200%201%20.018%201.042l-5.48%205.48a.49.49%200%200%200%200%20.707a.5.5%200%200%200%20.352.154a.5.5%200%200%200%20.356-.154l5.833-5.827a1.755%201.755%200%200%200%200-2.481Z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/octicon/paperclip-16.svg?color=%231a73e8&size=48
