textbox icon
textbox from Framework7 Icons by Vladimir Kharlampidi · Outline · MIT Free for personal and commercial use.
- Name
- textbox
- Set
- Framework7 Icons
- Style
- Outline
- Viewbox
- 56×56
- License
- MIT
The same icon in other sets
Use the textbox icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 56 56"><path fill="currentColor" d="M2.963 21.923c1.162 0 1.846-.684 1.846-1.869v-5.402c0-2.37 1.254-3.578 3.533-3.578H47.68c2.257 0 3.533 1.208 3.533 3.578v5.402c0 1.185.684 1.869 1.846 1.869c1.185 0 1.823-.684 1.823-1.869V14.47c0-4.695-2.37-7.066-7.157-7.066H8.296c-4.763 0-7.156 2.348-7.156 7.066v5.584c0 1.185.66 1.869 1.823 1.869m25.003 16.342c1.185 0 1.846-.798 1.846-2.051v-14.77h5.652c.89 0 1.527-.592 1.527-1.504c0-.934-.638-1.481-1.527-1.481H20.558c-.866 0-1.527.547-1.527 1.481c0 .912.661 1.504 1.527 1.504h5.607v14.77c0 1.208.638 2.05 1.8 2.05M2.963 30.766c1.641 0 2.963-1.344 2.963-2.985c0-1.619-1.322-2.94-2.963-2.94C1.345 24.84 0 26.161 0 27.78c0 1.64 1.345 2.985 2.963 2.985m50.097 0c1.618 0 2.94-1.344 2.94-2.985a2.947 2.947 0 0 0-2.94-2.94c-1.664 0-2.963 1.299-2.963 2.94c0 1.64 1.3 2.985 2.963 2.985m-44.764 18.6h39.43c4.787 0 7.157-2.37 7.157-7.066v-6.724c0-1.185-.661-1.846-1.823-1.846c-1.185 0-1.846.661-1.846 1.846v6.542c0 2.37-1.276 3.578-3.533 3.578H8.341c-2.278 0-3.532-1.208-3.532-3.578v-6.542c0-1.185-.684-1.846-1.846-1.846s-1.823.661-1.823 1.846V42.3c0 4.718 2.393 7.066 7.156 7.066"/></svg>
React
import type { SVGProps } from "react";
export function F7Textbox(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 56 56"><path fill="currentColor" d="M2.963 21.923c1.162 0 1.846-.684 1.846-1.869v-5.402c0-2.37 1.254-3.578 3.533-3.578H47.68c2.257 0 3.533 1.208 3.533 3.578v5.402c0 1.185.684 1.869 1.846 1.869c1.185 0 1.823-.684 1.823-1.869V14.47c0-4.695-2.37-7.066-7.157-7.066H8.296c-4.763 0-7.156 2.348-7.156 7.066v5.584c0 1.185.66 1.869 1.823 1.869m25.003 16.342c1.185 0 1.846-.798 1.846-2.051v-14.77h5.652c.89 0 1.527-.592 1.527-1.504c0-.934-.638-1.481-1.527-1.481H20.558c-.866 0-1.527.547-1.527 1.481c0 .912.661 1.504 1.527 1.504h5.607v14.77c0 1.208.638 2.05 1.8 2.05M2.963 30.766c1.641 0 2.963-1.344 2.963-2.985c0-1.619-1.322-2.94-2.963-2.94C1.345 24.84 0 26.161 0 27.78c0 1.64 1.345 2.985 2.963 2.985m50.097 0c1.618 0 2.94-1.344 2.94-2.985a2.947 2.947 0 0 0-2.94-2.94c-1.664 0-2.963 1.299-2.963 2.94c0 1.64 1.3 2.985 2.963 2.985m-44.764 18.6h39.43c4.787 0 7.157-2.37 7.157-7.066v-6.724c0-1.185-.661-1.846-1.823-1.846c-1.185 0-1.846.661-1.846 1.846v6.542c0 2.37-1.276 3.578-3.533 3.578H8.341c-2.278 0-3.532-1.208-3.532-3.578v-6.542c0-1.185-.684-1.846-1.846-1.846s-1.823.661-1.823 1.846V42.3c0 4.718 2.393 7.066 7.156 7.066"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 56 56"><path fill="currentColor" d="M2.963 21.923c1.162 0 1.846-.684 1.846-1.869v-5.402c0-2.37 1.254-3.578 3.533-3.578H47.68c2.257 0 3.533 1.208 3.533 3.578v5.402c0 1.185.684 1.869 1.846 1.869c1.185 0 1.823-.684 1.823-1.869V14.47c0-4.695-2.37-7.066-7.157-7.066H8.296c-4.763 0-7.156 2.348-7.156 7.066v5.584c0 1.185.66 1.869 1.823 1.869m25.003 16.342c1.185 0 1.846-.798 1.846-2.051v-14.77h5.652c.89 0 1.527-.592 1.527-1.504c0-.934-.638-1.481-1.527-1.481H20.558c-.866 0-1.527.547-1.527 1.481c0 .912.661 1.504 1.527 1.504h5.607v14.77c0 1.208.638 2.05 1.8 2.05M2.963 30.766c1.641 0 2.963-1.344 2.963-2.985c0-1.619-1.322-2.94-2.963-2.94C1.345 24.84 0 26.161 0 27.78c0 1.64 1.345 2.985 2.963 2.985m50.097 0c1.618 0 2.94-1.344 2.94-2.985a2.947 2.947 0 0 0-2.94-2.94c-1.664 0-2.963 1.299-2.963 2.94c0 1.64 1.3 2.985 2.963 2.985m-44.764 18.6h39.43c4.787 0 7.157-2.37 7.157-7.066v-6.724c0-1.185-.661-1.846-1.823-1.846c-1.185 0-1.846.661-1.846 1.846v6.542c0 2.37-1.276 3.578-3.533 3.578H8.341c-2.278 0-3.532-1.208-3.532-3.578v-6.542c0-1.185-.684-1.846-1.846-1.846s-1.823.661-1.823 1.846V42.3c0 4.718 2.393 7.066 7.156 7.066"/></svg> </template>
CSS
.icon-textbox {
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%2056%2056%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M2.963%2021.923c1.162%200%201.846-.684%201.846-1.869v-5.402c0-2.37%201.254-3.578%203.533-3.578H47.68c2.257%200%203.533%201.208%203.533%203.578v5.402c0%201.185.684%201.869%201.846%201.869c1.185%200%201.823-.684%201.823-1.869V14.47c0-4.695-2.37-7.066-7.157-7.066H8.296c-4.763%200-7.156%202.348-7.156%207.066v5.584c0%201.185.66%201.869%201.823%201.869m25.003%2016.342c1.185%200%201.846-.798%201.846-2.051v-14.77h5.652c.89%200%201.527-.592%201.527-1.504c0-.934-.638-1.481-1.527-1.481H20.558c-.866%200-1.527.547-1.527%201.481c0%20.912.661%201.504%201.527%201.504h5.607v14.77c0%201.208.638%202.05%201.8%202.05M2.963%2030.766c1.641%200%202.963-1.344%202.963-2.985c0-1.619-1.322-2.94-2.963-2.94C1.345%2024.84%200%2026.161%200%2027.78c0%201.64%201.345%202.985%202.963%202.985m50.097%200c1.618%200%202.94-1.344%202.94-2.985a2.947%202.947%200%200%200-2.94-2.94c-1.664%200-2.963%201.299-2.963%202.94c0%201.64%201.3%202.985%202.963%202.985m-44.764%2018.6h39.43c4.787%200%207.157-2.37%207.157-7.066v-6.724c0-1.185-.661-1.846-1.823-1.846c-1.185%200-1.846.661-1.846%201.846v6.542c0%202.37-1.276%203.578-3.533%203.578H8.341c-2.278%200-3.532-1.208-3.532-3.578v-6.542c0-1.185-.684-1.846-1.846-1.846s-1.823.661-1.823%201.846V42.3c0%204.718%202.393%207.066%207.156%207.066%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%2056%2056%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M2.963%2021.923c1.162%200%201.846-.684%201.846-1.869v-5.402c0-2.37%201.254-3.578%203.533-3.578H47.68c2.257%200%203.533%201.208%203.533%203.578v5.402c0%201.185.684%201.869%201.846%201.869c1.185%200%201.823-.684%201.823-1.869V14.47c0-4.695-2.37-7.066-7.157-7.066H8.296c-4.763%200-7.156%202.348-7.156%207.066v5.584c0%201.185.66%201.869%201.823%201.869m25.003%2016.342c1.185%200%201.846-.798%201.846-2.051v-14.77h5.652c.89%200%201.527-.592%201.527-1.504c0-.934-.638-1.481-1.527-1.481H20.558c-.866%200-1.527.547-1.527%201.481c0%20.912.661%201.504%201.527%201.504h5.607v14.77c0%201.208.638%202.05%201.8%202.05M2.963%2030.766c1.641%200%202.963-1.344%202.963-2.985c0-1.619-1.322-2.94-2.963-2.94C1.345%2024.84%200%2026.161%200%2027.78c0%201.64%201.345%202.985%202.963%202.985m50.097%200c1.618%200%202.94-1.344%202.94-2.985a2.947%202.947%200%200%200-2.94-2.94c-1.664%200-2.963%201.299-2.963%202.94c0%201.64%201.3%202.985%202.963%202.985m-44.764%2018.6h39.43c4.787%200%207.157-2.37%207.157-7.066v-6.724c0-1.185-.661-1.846-1.823-1.846c-1.185%200-1.846.661-1.846%201.846v6.542c0%202.37-1.276%203.578-3.533%203.578H8.341c-2.278%200-3.532-1.208-3.532-3.578v-6.542c0-1.185-.684-1.846-1.846-1.846s-1.823.661-1.823%201.846V42.3c0%204.718%202.393%207.066%207.156%207.066%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/f7/textbox.svg?color=%231a73e8&size=48
