Add icons to this collection by clicking the heart icon.
Keyboard icon - also known as music, electronic, instrument, keyboard, piano, hobbies and free time, and music and multimedia. Created in a clean lineal color style with a white, silver, gray, black, yellow, and teal finish, 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="682.667"
height="682.667"
viewBox="0 0 682.667 682.667"
>
<defs>
<clipPath id="a" clipPathUnits="userSpaceOnUse">
<path d="M0 512h512V0H0Z" />
</clipPath>
</defs>
<path
d="M101.229 55.465h65.422v188.03h-65.422z"
transform="matrix(1.33333 0 0 -1.33333 0 682.667)"
fill="#dbedff"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M101.229 55.465h32.711v188.03h-32.711z"
transform="matrix(1.33333 0 0 -1.33333 0 682.667)"
fill="#b5dcff"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M223.228 55.465h65.423v188.03h-65.423z"
transform="matrix(1.33333 0 0 -1.33333 0 682.667)"
fill="#dbedff"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M223.228 55.465h32.712v188.03h-32.712z"
transform="matrix(1.33333 0 0 -1.33333 0 682.667)"
fill="#b5dcff"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M345.228 55.465h65.423v188.03h-65.423z"
transform="matrix(1.33333 0 0 -1.33333 0 682.667)"
fill="#dbedff"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M345.228 55.465h32.711v188.03h-32.711z"
transform="matrix(1.33333 0 0 -1.33333 0 682.667)"
fill="#b5dcff"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<g clip-path="url(#a)" transform="matrix(1.33333 0 0 -1.33333 0 682.667)">
<path
d="M0 0h-25.991c-1.813 0-3.518.444-5.028 1.218v-171.451c0-9.829 7.968-17.797 17.797-17.797H0Z"
transform="translate(44.484 243.495)"
fill="#3f6d8e"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0h-25.992v-188.03h13.222c9.829 0 17.796 7.968 17.796 17.797V1.218A10.973 10.973 0 0 0 0 0"
transform="translate(493.388 243.495)"
fill="#477b9e"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M42.44 55.465h61v188.03h-61z"
fill="#dbedff"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M42.44 55.465h30.5v188.03h-30.5z"
fill="#b5dcff"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M164.44 55.465h61v188.03h-61z"
fill="#dbedff"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M164.44 55.465h30.5v188.03h-30.5z"
fill="#b5dcff"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M286.44 55.465h61v188.03h-61z"
fill="#dbedff"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M286.44 55.465h30.5v188.03h-30.5z"
fill="#b5dcff"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M408.439 55.465h61v188.03h-61z"
fill="#dbedff"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M408.439 55.465h30.5v188.03h-30.5z"
fill="#b5dcff"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0v-91.408a9.821 9.821 0 0 1 9.822-9.822h19.653c5.424 0 9.822 4.397 9.822 9.822V0Z"
transform="translate(144.792 243.495)"
fill="#477b9e"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0v91.409h-19.648V0c0-5.424 4.397-9.821 9.822-9.821H9.822C4.397-9.821 0-5.424 0 0"
transform="translate(164.44 152.086)"
fill="#365e7d"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0v-91.408c0-5.425 4.397-9.822 9.821-9.822h19.654c5.424 0 9.822 4.397 9.822 9.822V0Z"
transform="translate(205.792 243.495)"
fill="#477b9e"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0v91.409h-19.648V0c0-5.424 4.397-9.821 9.821-9.821H9.821C4.397-9.821 0-5.424 0 0"
transform="translate(225.44 152.086)"
fill="#365e7d"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0v-91.408a9.821 9.821 0 0 1 9.822-9.822h19.654c5.423 0 9.821 4.397 9.821 9.822V0Z"
transform="translate(83.792 243.495)"
fill="#477b9e"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0v91.409h-19.648V0c0-5.424 4.397-9.821 9.822-9.821H9.822C4.397-9.821 0-5.424 0 0"
transform="translate(103.44 152.086)"
fill="#365e7d"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0v-91.408c0-5.425 4.397-9.822 9.821-9.822h19.654c5.424 0 9.822 4.397 9.822 9.822V0Z"
transform="translate(266.792 243.495)"
fill="#477b9e"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0v91.409h-19.648V0c0-5.424 4.397-9.821 9.821-9.821H9.821C4.397-9.821 0-5.424 0 0"
transform="translate(286.44 152.086)"
fill="#365e7d"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0v-91.408a9.821 9.821 0 0 1 9.822-9.822h19.654c5.423 0 9.821 4.397 9.821 9.822V0Z"
transform="translate(388.791 243.495)"
fill="#477b9e"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0v91.409h-19.648V0c0-5.424 4.397-9.821 9.822-9.821H9.822C4.397-9.821 0-5.424 0 0"
transform="translate(408.44 152.086)"
fill="#365e7d"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0v-91.408c0-5.425 4.396-9.822 9.821-9.822h19.654c5.424 0 9.822 4.397 9.822 9.822V0Z"
transform="translate(327.792 243.495)"
fill="#477b9e"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0v91.409h-19.648V0c0-5.424 4.397-9.821 9.821-9.821H9.821C4.397-9.821 0-5.424 0 0"
transform="translate(347.44 152.086)"
fill="#365e7d"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0v-20.234c0-6.104 4.948-11.051 11.052-11.051h474.894c6.104 0 11.051 4.947 11.051 11.051V0Z"
transform="translate(7.441 271.78)"
fill="#f4dd45"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0h-95.267c-28.465 0-51.541-23.076-51.541-51.542s-23.076-51.541-51.542-51.541h-193.117c-29.816 0-53.988-24.172-53.988-53.988v-29.684H51.542v135.213C51.542-23.076 28.466 0 0 0"
transform="translate(452.897 456.535)"
fill="#477b9e"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0h-65.499c-29.816 0-53.988-24.172-53.988-53.988v-29.684h65.499v29.684C-53.988-24.172-29.817 0 0 0"
transform="translate(126.929 353.452)"
fill="#3f6d8e"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0c0 28.466 23.075 51.542 51.541 51.542h-65.499c-28.466 0-51.541-23.076-51.541-51.542s-23.076-51.541-51.542-51.541h65.499C-23.076-51.541 0-28.466 0 0"
transform="translate(371.588 404.993)"
fill="#3f6d8e"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0a9.821 9.821 0 0 0-9.822 9.822V98.23h-41.351V-86.8H9.826V0Z"
transform="translate(93.674 142.265)"
fill="none"
stroke="#000"
stroke-width="15"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
stroke-dasharray="none"
stroke-opacity="1"
/>
<path
d="M0 0a9.821 9.821 0 0 0-9.822 9.822V98.23h-21.703V9.822c0-5.425-4.398-9.822-9.822-9.822h-9.827v-86.8h61V0Z"
transform="translate(154.674 142.265)"
fill="none"
stroke="#000"
stroke-width="15"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
stroke-dasharray="none"
stroke-opacity="1"
/>
<path
d="M0 0a9.821 9.821 0 0 0-9.822 9.822V98.23h-21.703V9.822c0-5.425-4.398-9.822-9.822-9.822h-9.827v-86.8h61V0Z"
transform="translate(215.674 142.265)"
fill="none"
stroke="#000"
stroke-width="15"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
stroke-dasharray="none"
stroke-opacity="1"
/>
<path
d="M0 0a9.821 9.821 0 0 0-9.822 9.822V98.23h-21.703V9.822c0-5.425-4.398-9.822-9.823-9.822h-9.826v-86.8h61V0Z"
transform="translate(276.674 142.265)"
fill="none"
stroke="#000"
stroke-width="15"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
stroke-dasharray="none"
stroke-opacity="1"
/>
<path
d="M0 0a9.821 9.821 0 0 0-9.822 9.822V98.23h-21.703V9.822c0-5.425-4.398-9.822-9.823-9.822h-9.826v-86.8h61V0Z"
transform="translate(337.674 142.265)"
fill="none"
stroke="#000"
stroke-width="15"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
stroke-dasharray="none"
stroke-opacity="1"
/>
<path
d="M0 0c-5.424 0-9.821 4.397-9.821 9.822V98.23h-21.703V9.822c0-5.425-4.398-9.822-9.823-9.822h-9.826v-86.8h61V0Z"
transform="translate(398.673 142.265)"
fill="none"
stroke="#000"
stroke-width="15"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
stroke-dasharray="none"
stroke-opacity="1"
/>
<path
d="M0 0v-88.408a9.821 9.821 0 0 0-9.822-9.822h-9.826v-86.8h60.999V0Z"
transform="translate(428.148 240.495)"
fill="none"
stroke="#000"
stroke-width="15"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
stroke-dasharray="none"
stroke-opacity="1"
/>
<path
d="M0 0v-18.234c0-6.104 4.947-11.051 11.051-11.051h474.894c6.104 0 11.052 4.947 11.052 11.051V0Z"
transform="translate(7.502 269.78)"
fill="none"
stroke="#000"
stroke-width="15"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
stroke-dasharray="none"
stroke-opacity="1"
/>
<path
d="M0 0h-474.895c-1.812 0-3.517.444-5.027 1.218v-168.452c0-9.828 7.968-17.796 17.797-17.796H-12.77c9.83 0 17.797 7.968 17.797 17.796V1.218A10.98 10.98 0 0 0 0 0Z"
transform="translate(493.447 240.495)"
fill="none"
stroke="#000"
stroke-width="15"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
stroke-dasharray="none"
stroke-opacity="1"
/>
<path
d="M0 0v-88.408a9.821 9.821 0 0 1 9.822-9.822h19.654c5.423 0 9.821 4.397 9.821 9.822V0Z"
transform="translate(144.851 240.495)"
fill="none"
stroke="#000"
stroke-width="15"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
stroke-dasharray="none"
stroke-opacity="1"
/>
<path
d="M0 0v-88.408a9.821 9.821 0 0 1 9.822-9.822h19.653c5.424 0 9.822 4.397 9.822 9.822V0Z"
transform="translate(205.851 240.495)"
fill="none"
stroke="#000"
stroke-width="15"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
stroke-dasharray="none"
stroke-opacity="1"
/>
<path
d="M0 0v-88.408a9.821 9.821 0 0 1 9.822-9.822h19.654c5.423 0 9.821 4.397 9.821 9.822V0Z"
transform="translate(83.852 240.495)"
fill="none"
stroke="#000"
stroke-width="15"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
stroke-dasharray="none"
stroke-opacity="1"
/>
<path
d="M0 0v-88.408a9.821 9.821 0 0 1 9.822-9.822h19.653c5.424 0 9.822 4.397 9.822 9.822V0Z"
transform="translate(266.851 240.495)"
fill="none"
stroke="#000"
stroke-width="15"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
stroke-dasharray="none"
stroke-opacity="1"
/>
<path
d="M0 0v-88.408c0-5.425 4.397-9.822 9.821-9.822h19.654c5.424 0 9.822 4.397 9.822 9.822V0Z"
transform="translate(388.851 240.495)"
fill="none"
stroke="#000"
stroke-width="15"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
stroke-dasharray="none"
stroke-opacity="1"
/>
<path
d="M0 0v-88.408a9.821 9.821 0 0 1 9.822-9.822h19.653c5.424 0 9.822 4.397 9.822 9.822V0Z"
transform="translate(327.851 240.495)"
fill="none"
stroke="#000"
stroke-width="15"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
stroke-dasharray="none"
stroke-opacity="1"
/>
<path
d="M0 0v41.835c0 28.466-23.076 51.542-51.542 51.542h-95.267c-28.465 0-51.542-23.076-51.542-51.542s-23.076-51.541-51.542-51.541h-72.606"
transform="translate(504.499 363.158)"
fill="none"
stroke="#000"
stroke-width="15"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
stroke-dasharray="none"
stroke-opacity="1"
/>
<path
d="M0 0h-85.511c-29.816 0-53.988-24.172-53.988-53.988v-29.684h496.998v58.378"
transform="translate(147 353.452)"
fill="none"
stroke="#000"
stroke-width="15"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
stroke-dasharray="none"
stroke-opacity="1"
/>
</g>
</svg>
More icons in the same style and category