text input icon
text-input from Reicon by REICON · Outline · Text-formatting · MIT Free for personal and commercial use.
- Name
- text-input
- Set
- Reicon
- Style
- Outline
- Category
- Text-formatting
- Viewbox
- 24×24
- License
- MIT
2 other variants in Reicon
More text-formatting icons from Reicon
Use the text input icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="currentColor"><path d="M7.884 7.75c-.4 0-.766 0-1.066.037c-.329.041-.68.137-.98.405a2 2 0 0 0-.146.146c-.268.3-.364.651-.405.98c-.037.3-.037.666-.037 1.066v.041a.75.75 0 0 0 1.5 0c0-.455.001-.726.026-.922c.024-.195.227-.227.227-.227c.196-.025.467-.026.922-.026h.325v5.5H7a.75.75 0 0 0 0 1.5h4a.75.75 0 0 0 0-1.5H9.75v-5.5h.325c.455 0 .726.001.922.026c0 0 .203.032.227.227c.025.196.026.467.026.922a.75.75 0 0 0 1.5 0v-.041c0-.4 0-.766-.037-1.066c-.041-.329-.137-.68-.405-.98a2 2 0 0 0-.146-.146c-.3-.268-.651-.364-.98-.405c-.3-.037-.666-.037-1.066-.037z"/><path fill-rule="evenodd" d="M14.056 3.25H9.944c-1.838 0-3.294 0-4.433.153c-1.172.158-2.121.49-2.87 1.238c-.748.749-1.08 1.698-1.238 2.87c-.153 1.14-.153 2.595-.153 4.433v.112c0 1.838 0 3.294.153 4.433c.158 1.172.49 2.121 1.238 2.87c.749.748 1.698 1.08 2.87 1.238c1.14.153 2.595.153 4.433.153h4.112c1.838 0 3.294 0 4.433-.153c1.172-.158 2.121-.49 2.87-1.238c.748-.749 1.08-1.698 1.238-2.87c.153-1.14.153-2.595.153-4.433v-.112c0-1.838 0-3.294-.153-4.433c-.158-1.172-.49-2.121-1.238-2.87c-.749-.748-1.698-1.08-2.87-1.238c-1.14-.153-2.595-.153-4.433-.153M3.702 5.702c.423-.423 1.003-.677 2.009-.812c1.028-.138 2.382-.14 4.289-.14h4c1.907 0 3.262.002 4.29.14c1.005.135 1.585.389 2.008.812s.677 1.003.812 2.009c.138 1.028.14 2.382.14 4.289s-.002 3.262-.14 4.29c-.135 1.005-.389 1.585-.812 2.008s-1.003.677-2.009.812c-1.027.138-2.382.14-4.289.14h-4c-1.907 0-3.261-.002-4.29-.14c-1.005-.135-1.585-.389-2.008-.812s-.677-1.003-.812-2.009c-.138-1.028-.14-2.382-.14-4.289s.002-3.261.14-4.29c.135-1.005.389-1.585.812-2.008" clip-rule="evenodd"/></g></svg>
React
import type { SVGProps } from "react";
export function ReiconTextInput(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="M7.884 7.75c-.4 0-.766 0-1.066.037c-.329.041-.68.137-.98.405a2 2 0 0 0-.146.146c-.268.3-.364.651-.405.98c-.037.3-.037.666-.037 1.066v.041a.75.75 0 0 0 1.5 0c0-.455.001-.726.026-.922c.024-.195.227-.227.227-.227c.196-.025.467-.026.922-.026h.325v5.5H7a.75.75 0 0 0 0 1.5h4a.75.75 0 0 0 0-1.5H9.75v-5.5h.325c.455 0 .726.001.922.026c0 0 .203.032.227.227c.025.196.026.467.026.922a.75.75 0 0 0 1.5 0v-.041c0-.4 0-.766-.037-1.066c-.041-.329-.137-.68-.405-.98a2 2 0 0 0-.146-.146c-.3-.268-.651-.364-.98-.405c-.3-.037-.666-.037-1.066-.037z"/><path fillRule="evenodd" d="M14.056 3.25H9.944c-1.838 0-3.294 0-4.433.153c-1.172.158-2.121.49-2.87 1.238c-.748.749-1.08 1.698-1.238 2.87c-.153 1.14-.153 2.595-.153 4.433v.112c0 1.838 0 3.294.153 4.433c.158 1.172.49 2.121 1.238 2.87c.749.748 1.698 1.08 2.87 1.238c1.14.153 2.595.153 4.433.153h4.112c1.838 0 3.294 0 4.433-.153c1.172-.158 2.121-.49 2.87-1.238c.748-.749 1.08-1.698 1.238-2.87c.153-1.14.153-2.595.153-4.433v-.112c0-1.838 0-3.294-.153-4.433c-.158-1.172-.49-2.121-1.238-2.87c-.749-.748-1.698-1.08-2.87-1.238c-1.14-.153-2.595-.153-4.433-.153M3.702 5.702c.423-.423 1.003-.677 2.009-.812c1.028-.138 2.382-.14 4.289-.14h4c1.907 0 3.262.002 4.29.14c1.005.135 1.585.389 2.008.812s.677 1.003.812 2.009c.138 1.028.14 2.382.14 4.289s-.002 3.262-.14 4.29c-.135 1.005-.389 1.585-.812 2.008s-1.003.677-2.009.812c-1.027.138-2.382.14-4.289.14h-4c-1.907 0-3.261-.002-4.29-.14c-1.005-.135-1.585-.389-2.008-.812s-.677-1.003-.812-2.009c-.138-1.028-.14-2.382-.14-4.289s.002-3.261.14-4.29c.135-1.005.389-1.585.812-2.008" clipRule="evenodd"/></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="M7.884 7.75c-.4 0-.766 0-1.066.037c-.329.041-.68.137-.98.405a2 2 0 0 0-.146.146c-.268.3-.364.651-.405.98c-.037.3-.037.666-.037 1.066v.041a.75.75 0 0 0 1.5 0c0-.455.001-.726.026-.922c.024-.195.227-.227.227-.227c.196-.025.467-.026.922-.026h.325v5.5H7a.75.75 0 0 0 0 1.5h4a.75.75 0 0 0 0-1.5H9.75v-5.5h.325c.455 0 .726.001.922.026c0 0 .203.032.227.227c.025.196.026.467.026.922a.75.75 0 0 0 1.5 0v-.041c0-.4 0-.766-.037-1.066c-.041-.329-.137-.68-.405-.98a2 2 0 0 0-.146-.146c-.3-.268-.651-.364-.98-.405c-.3-.037-.666-.037-1.066-.037z"/><path fill-rule="evenodd" d="M14.056 3.25H9.944c-1.838 0-3.294 0-4.433.153c-1.172.158-2.121.49-2.87 1.238c-.748.749-1.08 1.698-1.238 2.87c-.153 1.14-.153 2.595-.153 4.433v.112c0 1.838 0 3.294.153 4.433c.158 1.172.49 2.121 1.238 2.87c.749.748 1.698 1.08 2.87 1.238c1.14.153 2.595.153 4.433.153h4.112c1.838 0 3.294 0 4.433-.153c1.172-.158 2.121-.49 2.87-1.238c.748-.749 1.08-1.698 1.238-2.87c.153-1.14.153-2.595.153-4.433v-.112c0-1.838 0-3.294-.153-4.433c-.158-1.172-.49-2.121-1.238-2.87c-.749-.748-1.698-1.08-2.87-1.238c-1.14-.153-2.595-.153-4.433-.153M3.702 5.702c.423-.423 1.003-.677 2.009-.812c1.028-.138 2.382-.14 4.289-.14h4c1.907 0 3.262.002 4.29.14c1.005.135 1.585.389 2.008.812s.677 1.003.812 2.009c.138 1.028.14 2.382.14 4.289s-.002 3.262-.14 4.29c-.135 1.005-.389 1.585-.812 2.008s-1.003.677-2.009.812c-1.027.138-2.382.14-4.289.14h-4c-1.907 0-3.261-.002-4.29-.14c-1.005-.135-1.585-.389-2.008-.812s-.677-1.003-.812-2.009c-.138-1.028-.14-2.382-.14-4.289s.002-3.261.14-4.29c.135-1.005.389-1.585.812-2.008" clip-rule="evenodd"/></g></svg> </template>
CSS
.icon-text-input {
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%22M7.884%207.75c-.4%200-.766%200-1.066.037c-.329.041-.68.137-.98.405a2%202%200%200%200-.146.146c-.268.3-.364.651-.405.98c-.037.3-.037.666-.037%201.066v.041a.75.75%200%200%200%201.5%200c0-.455.001-.726.026-.922c.024-.195.227-.227.227-.227c.196-.025.467-.026.922-.026h.325v5.5H7a.75.75%200%200%200%200%201.5h4a.75.75%200%200%200%200-1.5H9.75v-5.5h.325c.455%200%20.726.001.922.026c0%200%20.203.032.227.227c.025.196.026.467.026.922a.75.75%200%200%200%201.5%200v-.041c0-.4%200-.766-.037-1.066c-.041-.329-.137-.68-.405-.98a2%202%200%200%200-.146-.146c-.3-.268-.651-.364-.98-.405c-.3-.037-.666-.037-1.066-.037z%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20d%3D%22M14.056%203.25H9.944c-1.838%200-3.294%200-4.433.153c-1.172.158-2.121.49-2.87%201.238c-.748.749-1.08%201.698-1.238%202.87c-.153%201.14-.153%202.595-.153%204.433v.112c0%201.838%200%203.294.153%204.433c.158%201.172.49%202.121%201.238%202.87c.749.748%201.698%201.08%202.87%201.238c1.14.153%202.595.153%204.433.153h4.112c1.838%200%203.294%200%204.433-.153c1.172-.158%202.121-.49%202.87-1.238c.748-.749%201.08-1.698%201.238-2.87c.153-1.14.153-2.595.153-4.433v-.112c0-1.838%200-3.294-.153-4.433c-.158-1.172-.49-2.121-1.238-2.87c-.749-.748-1.698-1.08-2.87-1.238c-1.14-.153-2.595-.153-4.433-.153M3.702%205.702c.423-.423%201.003-.677%202.009-.812c1.028-.138%202.382-.14%204.289-.14h4c1.907%200%203.262.002%204.29.14c1.005.135%201.585.389%202.008.812s.677%201.003.812%202.009c.138%201.028.14%202.382.14%204.289s-.002%203.262-.14%204.29c-.135%201.005-.389%201.585-.812%202.008s-1.003.677-2.009.812c-1.027.138-2.382.14-4.289.14h-4c-1.907%200-3.261-.002-4.29-.14c-1.005-.135-1.585-.389-2.008-.812s-.677-1.003-.812-2.009c-.138-1.028-.14-2.382-.14-4.289s.002-3.261.14-4.29c.135-1.005.389-1.585.812-2.008%22%20clip-rule%3D%22evenodd%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%22M7.884%207.75c-.4%200-.766%200-1.066.037c-.329.041-.68.137-.98.405a2%202%200%200%200-.146.146c-.268.3-.364.651-.405.98c-.037.3-.037.666-.037%201.066v.041a.75.75%200%200%200%201.5%200c0-.455.001-.726.026-.922c.024-.195.227-.227.227-.227c.196-.025.467-.026.922-.026h.325v5.5H7a.75.75%200%200%200%200%201.5h4a.75.75%200%200%200%200-1.5H9.75v-5.5h.325c.455%200%20.726.001.922.026c0%200%20.203.032.227.227c.025.196.026.467.026.922a.75.75%200%200%200%201.5%200v-.041c0-.4%200-.766-.037-1.066c-.041-.329-.137-.68-.405-.98a2%202%200%200%200-.146-.146c-.3-.268-.651-.364-.98-.405c-.3-.037-.666-.037-1.066-.037z%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20d%3D%22M14.056%203.25H9.944c-1.838%200-3.294%200-4.433.153c-1.172.158-2.121.49-2.87%201.238c-.748.749-1.08%201.698-1.238%202.87c-.153%201.14-.153%202.595-.153%204.433v.112c0%201.838%200%203.294.153%204.433c.158%201.172.49%202.121%201.238%202.87c.749.748%201.698%201.08%202.87%201.238c1.14.153%202.595.153%204.433.153h4.112c1.838%200%203.294%200%204.433-.153c1.172-.158%202.121-.49%202.87-1.238c.748-.749%201.08-1.698%201.238-2.87c.153-1.14.153-2.595.153-4.433v-.112c0-1.838%200-3.294-.153-4.433c-.158-1.172-.49-2.121-1.238-2.87c-.749-.748-1.698-1.08-2.87-1.238c-1.14-.153-2.595-.153-4.433-.153M3.702%205.702c.423-.423%201.003-.677%202.009-.812c1.028-.138%202.382-.14%204.289-.14h4c1.907%200%203.262.002%204.29.14c1.005.135%201.585.389%202.008.812s.677%201.003.812%202.009c.138%201.028.14%202.382.14%204.289s-.002%203.262-.14%204.29c-.135%201.005-.389%201.585-.812%202.008s-1.003.677-2.009.812c-1.027.138-2.382.14-4.289.14h-4c-1.907%200-3.261-.002-4.29-.14c-1.005-.135-1.585-.389-2.008-.812s-.677-1.003-.812-2.009c-.138-1.028-.14-2.382-.14-4.289s.002-3.261.14-4.29c.135-1.005.389-1.585.812-2.008%22%20clip-rule%3D%22evenodd%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/reicon/text-input.svg?color=%231a73e8&size=48
