feather icon
feather-filled from Tabler Icons by Paweł Kuna · Filled · MIT Free for personal and commercial use.
- Name
- feather-filled
- Set
- Tabler Icons
- Style
- Filled
- Viewbox
- 24×24
- License
- MIT
1 other variant in Tabler Icons
The same icon in other sets
featherBootstrap IconsfeatherFont Awesome 6 SolidfeatherFont Awesome SolidfeatherFeather IconsfeatherFluent EmojifeatherFluent Emoji FlatfeatherFluent Emoji High ContrastfeatherHuge IconsfeatherJam IconsfeatherLine AwesomefeatherLucidefeatherMaterial Design IconsfeatherNoto EmojifeatherOpenMojifeatherPhosphorfeatherPixelarticonsfeatherTwitter Emoji
Related icons in Tabler Icons
Use the feather icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="currentColor"><path d="M8 9.585V16h6.414l-2.707 2.707a1 1 0 0 1-.112.097l-.11.071l-.114.054l-.105.035l-.149.03L11 19H6.414l-1.707 1.707a1 1 0 1 1-1.414-1.414L5 17.584V13l.003-.075l.017-.126l.03-.111l.044-.111l.052-.098l.067-.096l.08-.09z"/><path d="m19.414 11l-3 3H11.5l2.914-3zM13 4.586v4.998l-3 3V7.585zM16.482 3A4.515 4.515 0 0 1 21 7.514a4.7 4.7 0 0 1-.239 1.487L15 9V3.24c.469-.158.968-.24 1.482-.24"/></g></svg>
React
import type { SVGProps } from "react";
export function TablerFeatherFilled(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="currentColor"><path d="M8 9.585V16h6.414l-2.707 2.707a1 1 0 0 1-.112.097l-.11.071l-.114.054l-.105.035l-.149.03L11 19H6.414l-1.707 1.707a1 1 0 1 1-1.414-1.414L5 17.584V13l.003-.075l.017-.126l.03-.111l.044-.111l.052-.098l.067-.096l.08-.09z"/><path d="m19.414 11l-3 3H11.5l2.914-3zM13 4.586v4.998l-3 3V7.585zM16.482 3A4.515 4.515 0 0 1 21 7.514a4.7 4.7 0 0 1-.239 1.487L15 9V3.24c.469-.158.968-.24 1.482-.24"/></g></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="currentColor"><path d="M8 9.585V16h6.414l-2.707 2.707a1 1 0 0 1-.112.097l-.11.071l-.114.054l-.105.035l-.149.03L11 19H6.414l-1.707 1.707a1 1 0 1 1-1.414-1.414L5 17.584V13l.003-.075l.017-.126l.03-.111l.044-.111l.052-.098l.067-.096l.08-.09z"/><path d="m19.414 11l-3 3H11.5l2.914-3zM13 4.586v4.998l-3 3V7.585zM16.482 3A4.515 4.515 0 0 1 21 7.514a4.7 4.7 0 0 1-.239 1.487L15 9V3.24c.469-.158.968-.24 1.482-.24"/></g></svg> </template>
CSS
.icon-feather-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%2024%2024%22%3E%3Cg%20fill%3D%22currentColor%22%3E%3Cpath%20d%3D%22M8%209.585V16h6.414l-2.707%202.707a1%201%200%200%201-.112.097l-.11.071l-.114.054l-.105.035l-.149.03L11%2019H6.414l-1.707%201.707a1%201%200%201%201-1.414-1.414L5%2017.584V13l.003-.075l.017-.126l.03-.111l.044-.111l.052-.098l.067-.096l.08-.09z%22%2F%3E%3Cpath%20d%3D%22m19.414%2011l-3%203H11.5l2.914-3zM13%204.586v4.998l-3%203V7.585zM16.482%203A4.515%204.515%200%200%201%2021%207.514a4.7%204.7%200%200%201-.239%201.487L15%209V3.24c.469-.158.968-.24%201.482-.24%22%2F%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%2024%2024%22%3E%3Cg%20fill%3D%22currentColor%22%3E%3Cpath%20d%3D%22M8%209.585V16h6.414l-2.707%202.707a1%201%200%200%201-.112.097l-.11.071l-.114.054l-.105.035l-.149.03L11%2019H6.414l-1.707%201.707a1%201%200%201%201-1.414-1.414L5%2017.584V13l.003-.075l.017-.126l.03-.111l.044-.111l.052-.098l.067-.096l.08-.09z%22%2F%3E%3Cpath%20d%3D%22m19.414%2011l-3%203H11.5l2.914-3zM13%204.586v4.998l-3%203V7.585zM16.482%203A4.515%204.515%200%200%201%2021%207.514a4.7%204.7%200%200%201-.239%201.487L15%209V3.24c.469-.158.968-.24%201.482-.24%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/tabler/feather-filled.svg?color=%231a73e8&size=48
