Add icons to this collection by clicking the heart icon.
Keyboard icon - also known as computer, communication, button, wireless, keyboard, typing, communications, hardware, caps, and chat box. Created in a clean flat gradient style, perfect for web, apps, and UI projects. Available in SVG and PNG, with multiple style variants.
<svg
xmlns="http://www.w3.org/2000/svg"
width="512"
height="512"
viewBox="0 0 64 64"
>
<linearGradient id="a">
<stop offset="0" stop-color="#7fc7f1" />
<stop offset="1" stop-color="#00a4ff" />
</linearGradient>
<linearGradient
id="c"
x1="5"
x2="59"
y1="49"
y2="49"
gradientUnits="userSpaceOnUse"
href="#a"
/>
<linearGradient id="b">
<stop offset="0" stop-color="#efe7dd" />
<stop offset="1" stop-color="#dfcebe" />
</linearGradient>
<linearGradient
id="d"
x1="9"
x2="15"
y1="41"
y2="41"
gradientUnits="userSpaceOnUse"
href="#b"
/>
<linearGradient
id="e"
x1="18"
x2="46"
y1="57"
y2="57"
gradientUnits="userSpaceOnUse"
href="#b"
/>
<linearGradient
id="f"
x1="10"
x2="16"
y1="57"
y2="57"
gradientUnits="userSpaceOnUse"
href="#b"
/>
<linearGradient
id="g"
x1="48"
x2="54"
y1="57"
y2="57"
gradientUnits="userSpaceOnUse"
href="#b"
/>
<linearGradient
id="h"
x1="45"
x2="51"
y1="49"
y2="49"
gradientUnits="userSpaceOnUse"
href="#b"
/>
<linearGradient
id="i"
x1="37"
x2="43"
y1="49"
y2="49"
gradientUnits="userSpaceOnUse"
href="#b"
/>
<linearGradient
id="j"
x1="29"
x2="35"
y1="49"
y2="49"
gradientUnits="userSpaceOnUse"
href="#b"
/>
<linearGradient
id="k"
x1="21"
x2="27"
y1="49"
y2="49"
gradientUnits="userSpaceOnUse"
href="#b"
/>
<linearGradient
id="l"
x1="13"
x2="19"
y1="49"
y2="49"
gradientUnits="userSpaceOnUse"
href="#b"
/>
<linearGradient
id="m"
x1="41"
x2="47"
y1="41"
y2="41"
gradientUnits="userSpaceOnUse"
href="#b"
/>
<linearGradient
id="n"
x1="33"
x2="39"
y1="41"
y2="41"
gradientUnits="userSpaceOnUse"
href="#b"
/>
<linearGradient
id="o"
x1="25"
x2="31"
y1="41"
y2="41"
gradientUnits="userSpaceOnUse"
href="#b"
/>
<linearGradient
id="p"
x1="17"
x2="23"
y1="41"
y2="41"
gradientUnits="userSpaceOnUse"
href="#b"
/>
<linearGradient
id="q"
x1="49"
x2="55"
y1="41"
y2="41"
gradientUnits="userSpaceOnUse"
href="#b"
/>
<linearGradient
id="r"
x1="16"
x2="48"
y1="16"
y2="16"
gradientUnits="userSpaceOnUse"
href="#b"
/>
<linearGradient
id="s"
x1="21"
x2="29"
y1="8"
y2="8"
gradientUnits="userSpaceOnUse"
href="#a"
/>
<linearGradient
id="t"
x1="21"
x2="43"
y1="12"
y2="12"
gradientUnits="userSpaceOnUse"
href="#a"
/>
<linearGradient
id="u"
x1="21"
x2="43"
y1="16"
y2="16"
gradientUnits="userSpaceOnUse"
href="#a"
/>
<linearGradient
id="v"
x1="21"
x2="37"
y1="20"
y2="20"
gradientUnits="userSpaceOnUse"
href="#a"
/>
<path
fill="url(#c)"
d="M56 34H8c-1.654 0-3 1.346-3 3v24c0 1.654 1.346 3 3 3h48c1.654 0 3-1.346 3-3V37c0-1.654-1.346-3-3-3z"
/>
<path
fill="url(#d)"
d="M14 38h-4a1 1 0 0 0-1 1v4a1 1 0 0 0 1 1h4a1 1 0 0 0 1-1v-4a1 1 0 0 0-1-1z"
/>
<path
fill="url(#e)"
d="M45 54H19a1 1 0 0 0-1 1v4a1 1 0 0 0 1 1h26a1 1 0 0 0 1-1v-4a1 1 0 0 0-1-1z"
/>
<path
fill="url(#f)"
d="M15 54h-4a1 1 0 0 0-1 1v4a1 1 0 0 0 1 1h4a1 1 0 0 0 1-1v-4a1 1 0 0 0-1-1z"
/>
<path
fill="url(#g)"
d="M53 54h-4a1 1 0 0 0-1 1v4a1 1 0 0 0 1 1h4a1 1 0 0 0 1-1v-4a1 1 0 0 0-1-1z"
/>
<path
fill="url(#h)"
d="M51 51v-4a1 1 0 0 0-1-1h-4a1 1 0 0 0-1 1v4a1 1 0 0 0 1 1h4a1 1 0 0 0 1-1z"
/>
<path
fill="url(#i)"
d="M38 46a1 1 0 0 0-1 1v4a1 1 0 0 0 1 1h4a1 1 0 0 0 1-1v-4a1 1 0 0 0-1-1z"
/>
<path
fill="url(#j)"
d="M30 46a1 1 0 0 0-1 1v4a1 1 0 0 0 1 1h4a1 1 0 0 0 1-1v-4a1 1 0 0 0-1-1z"
/>
<path
fill="url(#k)"
d="M22 46a1 1 0 0 0-1 1v4a1 1 0 0 0 1 1h4a1 1 0 0 0 1-1v-4a1 1 0 0 0-1-1z"
/>
<path
fill="url(#l)"
d="M14 52h4a1 1 0 0 0 1-1v-4a1 1 0 0 0-1-1h-4a1 1 0 0 0-1 1v4a1 1 0 0 0 1 1z"
/>
<path
fill="url(#m)"
d="M42 44h4a1 1 0 0 0 1-1v-4a1 1 0 0 0-1-1h-4a1 1 0 0 0-1 1v4a1 1 0 0 0 1 1z"
/>
<path
fill="url(#n)"
d="M34 44h4a1 1 0 0 0 1-1v-4a1 1 0 0 0-1-1h-4a1 1 0 0 0-1 1v4a1 1 0 0 0 1 1z"
/>
<path
fill="url(#o)"
d="M26 44h4a1 1 0 0 0 1-1v-4a1 1 0 0 0-1-1h-4a1 1 0 0 0-1 1v4a1 1 0 0 0 1 1z"
/>
<path
fill="url(#p)"
d="M18 44h4a1 1 0 0 0 1-1v-4a1 1 0 0 0-1-1h-4a1 1 0 0 0-1 1v4a1 1 0 0 0 1 1z"
/>
<path
fill="url(#q)"
d="M54 38h-4a1 1 0 0 0-1 1v4a1 1 0 0 0 1 1h4a1 1 0 0 0 1-1v-4a1 1 0 0 0-1-1z"
/>
<path
fill="url(#r)"
d="M46 0H18c-1.103 0-2 .897-2 2v24c0 1.103.897 2 2 2h10.5l2.7 3.6a.998.998 0 0 0 1.6 0l2.7-3.6H46c1.102 0 2-.897 2-2V2c0-1.103-.898-2-2-2z"
/>
<path fill="url(#s)" d="M28 9h-6a1 1 0 1 1 0-2h6a1 1 0 1 1 0 2z" />
<path fill="url(#t)" d="M42 13H22a1 1 0 1 1 0-2h20a1 1 0 1 1 0 2z" />
<path fill="url(#u)" d="M42 17H22a1 1 0 1 1 0-2h20a1 1 0 1 1 0 2z" />
<path fill="url(#v)" d="M36 21H22a1 1 0 1 1 0-2h14a1 1 0 1 1 0 2z" />
</svg>
More icons in the same style and category