Input Icon
Free SVG icon from the Carbon Icons collection. Download or copy for use in any project.
The Input icon is available as a free SVG and is ready to drop into any web or app project.
img tag
<img src="https://proicons.com/icon/321107.svg" alt="Input icon" width="24" height="24">
React JSX
<img src="https://proicons.com/icon/321107.svg" alt="Input icon" width={24} height={24} />
Vue template
<img src="https://proicons.com/icon/321107.svg" alt="Input icon" :width="24" :height="24" />
CSS background
.icon-input {
background-image: url('https://proicons.com/icon/321107.svg');
background-size: contain;
background-repeat: no-repeat;
width: 24px;
height: 24px;
display: inline-block;
}
SVG markup
<?xml version="1.0" encoding="UTF-8"?>
<svg width="320px" height="180px" viewBox="0 0 320 180" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>input</title>
<g id="input" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="Group-21" transform="translate(56.000000, 72.000000)">
<rect id="Rectangle-11-Copy" fill="#F3F3F3" x="0" y="0" width="208" height="32"></rect>
<line x1="0" y1="31.5" x2="208" y2="31.5" id="Path-3-Copy-8" stroke="#8C8C8C"></line>
<rect id="Rectangle-Copy-14" fill="#A8A8A8" x="12.3888889" y="13" width="96" height="7"></rect>
</g>
<g id="Group" transform="translate(221.000000, 72.000000)" fill="#000000" fill-rule="nonzero">
<g id="beam">
<path d="M8.01154076,12 L9.00957667,12.0626445 C8.98412721,12.4680986 9.01146588,12.8751409 9.07115087,13.2023755 C9.18949988,13.5320302 9.35519407,13.8427068 9.54272722,14.0989138 C9.8994398,14.5217448 10.3542101,14.8508549 10.8673545,15.0575256 L10.831,15.041 L15.95,15.041 L15.9505587,14.0413222 L16.9305587,14.0413222 L16.93,15.041 L21.080775,15.0421853 C21.5059779,14.8630518 21.8891817,14.5996723 22.1969419,14.2821229 L22.3486284,14.1139134 C22.5566385,13.8328002 22.7220935,13.5225721 22.8210183,13.2595866 C22.9030412,12.8649013 22.9333928,12.4612256 22.9113095,12.0587128 L22.9113095,12.0587128 L23.9098079,12.0039317 C23.9366403,12.4930064 23.8997615,12.9834941 23.7814546,13.5294207 C23.63086,13.9512826 23.4189289,14.3486534 23.1343611,14.731784 C22.8769495,15.0400741 22.5794406,15.3104126 22.2508604,15.5362083 C22.5831284,15.7518889 22.893337,16.0167786 23.1782674,16.3282912 C23.4543219,16.690595 23.6642495,17.0987875 23.8107847,17.5829428 C23.9085432,18.0700751 23.9417355,18.5679587 23.9095056,19.0637568 L23.9095056,19.0637568 L22.9116118,18.9988877 C22.9381474,18.5906864 22.9108195,18.1807681 22.8427313,17.8285669 C22.7432553,17.5057549 22.5875726,17.2030385 22.4125713,16.9698267 C22.0327212,16.5568925 21.5652726,16.2342022 21.0444962,16.0254135 L21.058,16.031 L16.93,16.031 L16.9305587,17.0313222 L15.9505587,17.0313222 L15.95,16.031 L10.8621845,16.0312262 C10.4213844,16.2097657 10.0194082,16.4700261 9.69546364,16.7757425 L9.53858526,16.9339356 C9.33395359,17.2030871 9.17813941,17.5060591 9.09083484,17.7794513 C9.01052235,18.1807115 8.98318496,18.5907723 9.0095221,18.9991425 L9.0095221,18.9991425 L8.01159533,19.063502 C7.9796306,18.5678733 8.0128093,18.0701927 8.12288615,17.5335761 C8.25736457,17.0987989 8.46709369,16.6909923 8.77239079,16.2930141 C9.03739479,16.0046203 9.33620169,15.7510228 9.66150749,15.5372637 C9.33070063,15.3130943 9.02772091,15.038542 8.75809308,14.7180063 C8.49269208,14.3579775 8.28109923,13.9612409 8.11021128,13.4690944 C8.01383279,12.9857365 7.98066499,12.4919048 8.01154076,12 L8.01154076,12 Z" transform="translate(15.960713, 15.531878) rotate(90.000000) translate(-15.960713, -15.531878) "></path>
</g>
</g>
</g>
</svg>
Input in other icon packs
Copied!