Add icons to this collection by clicking the heart icon.
Keyboard icon - also known as music, instrument, keyboard, piano, childhood, musical notes, musical instrument, kid, music and multimedia, and kid and baby. Created in a clean lineal color 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="682.667"
height="682.667"
viewBox="0 0 682.667 682.667"
>
<defs>
<clipPath id="a" clipPathUnits="userSpaceOnUse">
<path d="M0 512h512V0H0Z" />
</clipPath>
</defs>
<g clip-path="url(#a)" transform="matrix(1.33333 0 0 -1.33333 0 682.667)">
<path
d="m0 0-20-85 20-85v-188.95c-7.171-9.067-40.92-20.43-46.43-20.43-170.87 0-309.39 158.52-309.39 329.39 0 43.71 18.57 84.545 55.42 122.99H-40c22.09 0 40-17.91 40-40Z"
transform="translate(504.5 423)"
fill="#97aabb"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0v-8.05c0-22.09-17.91-40-40-40h-31l-177.5 30-177.5-30h-31c-22.09 0-40 17.91-40 40v197l20 85-20 85v33c0 22.09 17.91 40 40 40h156.6c-16.36-37.69-25.42-79.28-25.42-122.99C-325.82 138.09-187.3-.43-16.43-.43-10.92-.43-5.44-.29 0 0"
transform="translate(504.5 64.05)"
fill="#8697a6"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0h71v122c0 11.046-8.954 20-20 20H17.75L0 132l-10-61Z"
transform="translate(362.5 16)"
fill="#fff4e5"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0h71v132l-17.75 10H0l-10-71Z"
transform="translate(291.5 16)"
fill="#ffebce"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0h71v142H17.75L0 132l-10-61Z"
transform="translate(220.5 16)"
fill="#fff4e5"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0h71v132l-17.75 10h-35.5L0 132l-10-56.525Z"
transform="translate(149.5 16)"
fill="#ffebce"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0h71v132l-17.75 10H20c-11.046 0-20-8.954-20-20Z"
transform="translate(78.5 16)"
fill="#fff4e5"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0h15.5c5.523 0 10 4.477 10 10v80H-10V10C-10 4.477-5.523 0 0 0"
transform="translate(141.75 68)"
fill="#6b7d8e"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0h15.5c5.523 0 10 4.477 10 10v80H-10V10C-10 4.477-5.523 0 0 0"
transform="translate(212.75 68)"
fill="#6b7d8e"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0h15.5c5.523 0 10 4.477 10 10v80H-10V10C-10 4.477-5.523 0 0 0"
transform="translate(354.75 68)"
fill="#6b7d8e"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0v170h-65c-46.944 0-85-38.056-85-85s38.056-85 85-85z"
transform="translate(504.5 253)"
fill="#77899b"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0c0-22.091 17.909-40 40-40S80-22.091 80 0 62.091 40 40 40 0 22.091 0 0"
transform="translate(394.5 338)"
fill="#6b7d8e"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0v170h65c46.944 0 85-38.056 85-85S111.944 0 65 0Z"
transform="translate(7.5 253)"
fill="#77899b"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0c0-22.091-17.909-40-40-40S-80-22.091-80 0s17.909 40 40 40S0 22.091 0 0"
transform="translate(117.5 338)"
fill="#6b7d8e"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0c-5.874-18.82-20.757-33.704-39.578-39.578-6.454-2.014-13.02 2.778-13.02 9.54v13.343c0 3.946 2.293 7.587 5.924 9.13A27.75 27.75 0 0 1-32.011 7.096c1.543 3.632 5.183 5.925 9.13 5.925H-9.54C-2.777 13.021 2.015 6.455 0 0"
transform="translate(323.605 309.987)"
fill="#a8c9ed"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0h-13.342c-3.946 0-7.587 2.293-9.13 5.925a27.755 27.755 0 0 1-14.662 14.661c-3.632 1.542-5.925 5.184-5.925 9.129v13.344c0 6.761 6.566 11.553 13.021 9.539C-11.218 46.724 3.666 31.84 9.54 13.021 11.554 6.565 6.762 0 0 0"
transform="translate(314.065 353.008)"
fill="#a8c9ed"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0v-13.366c0-6.772-6.575-11.541-13.042-9.534-9.203 2.856-17.633 7.924-24.64 14.933-7.009 7.007-12.075 15.438-14.931 24.64-2.008 6.467 2.762 13.042 9.533 13.042h13.365c3.945 0 7.587-2.292 9.129-5.923A27.756 27.756 0 0 1-5.924 9.129C-2.292 7.586 0 3.946 0 0"
transform="translate(241.007 293.293)"
fill="#a8c9ed"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0v-13.343c0-3.946-2.292-7.587-5.924-9.13a27.757 27.757 0 0 1-14.662-14.662c-1.542-3.631-5.184-5.924-9.129-5.924h-13.342c-6.762 0-11.554 6.566-9.54 13.021 5.876 18.82 20.758 33.703 39.577 39.577C-6.565 11.554 0 6.762 0 0"
transform="translate(241.007 396.066)"
fill="#a8c9ed"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0c0-8.284 6.716-15 15-15 8.284 0 15 6.716 15 15 0 8.284-6.716 15-15 15C6.716 15 0 8.284 0 0"
transform="translate(241 338)"
fill="#6b7d8e"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0c-.029-12.987-13.272-23.486-29.581-23.451-16.308.036-29.505 10.593-29.477 23.58.029 12.987 13.272 23.486 29.58 23.451C-13.169 23.544.028 12.987 0 0"
transform="translate(205.501 439.976)"
fill="#ffa1ac"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0c-.028-12.987 13.169-23.544 29.478-23.58 16.308-.035 29.551 10.464 29.58 23.451.028 12.987-13.169 23.544-29.478 23.58C13.272 23.486.029 12.987 0 0"
transform="translate(306.499 439.754)"
fill="#ffa1ac"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0h-30c-5.523 0-10-4.477-10-10v-15c0-5.523 4.477-10 10-10H0c5.523 0 10 4.477 10 10v15C10-4.477 5.523 0 0 0"
transform="translate(87.5 223)"
fill="#ff8f71"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0h-30c-5.523 0-10-4.477-10-10v-15c0-5.523 4.477-10 10-10H0c5.523 0 10 4.477 10 10v15C10-4.477 5.523 0 0 0"
transform="translate(191 223)"
fill="#77899b"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0h-30c-5.523 0-10-4.477-10-10v-15c0-5.523 4.477-10 10-10H0c5.523 0 10 4.477 10 10v15C10-4.477 5.523 0 0 0"
transform="translate(271 223)"
fill="#77899b"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0h-30c-5.523 0-10-4.477-10-10v-15c0-5.523 4.477-10 10-10H0c5.523 0 10 4.477 10 10v15C10-4.477 5.523 0 0 0"
transform="translate(351 223)"
fill="#77899b"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0h-30c-5.523 0-10-4.477-10-10v-15c0-5.523 4.477-10 10-10H0c5.523 0 10 4.477 10 10v15C10-4.477 5.523 0 0 0"
transform="translate(454.5 223)"
fill="#fbf198"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0v-287c0-22.09-17.91-40-40-40h-417c-22.09 0-40 17.91-40 40v400c0 22.09 17.91 40 40 40h417c22.09 0 40-17.91 40-40V35"
transform="translate(504.5 343)"
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 0v122c0 11.05 8.95 20 20 20h315c11.05 0 20-8.95 20-20V83.79"
transform="translate(78.5 16)"
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 0v48.79"
transform="translate(433.5 16)"
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 0v142"
transform="translate(291.5 16)"
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-52"
transform="translate(362.5 68)"
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-80c0-5.523 4.477-10 10-10h15.5c5.523 0 10 4.477 10 10V0"
transform="translate(344.75 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 0v52"
transform="translate(149.5 16)"
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-52"
transform="translate(220.5 68)"
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-80c0-5.523 4.477-10 10-10h15.5c5.523 0 10 4.477 10 10V0"
transform="translate(131.75 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 0v-80c0-5.523 4.477-10 10-10h15.5c5.523 0 10 4.477 10 10V0"
transform="translate(202.75 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-65c-46.944 0-85-38.056-85-85s38.056-85 85-85H0"
transform="translate(504.5 423)"
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 0c0-22.091 17.909-40 40-40S80-22.091 80 0 62.091 40 40 40 0 22.091 0 0Z"
transform="translate(394.5 338)"
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 0h65c23.47 0 44.72 9.52 60.1 24.9a85.026 85.026 0 0 1 13.48 17.54"
transform="translate(7.5 253)"
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 0h65c46.94 0 85-38.06 85-85 0-3.14-.17-6.23-.51-9.28"
transform="translate(7.5 423)"
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 0c0-22.091-17.909-40-40-40S-80-22.091-80 0s17.909 40 40 40S0 22.091 0 0Z"
transform="translate(117.5 338)"
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.874-18.82-20.757-33.704-39.578-39.578-6.454-2.014-13.02 2.778-13.02 9.54v13.343c0 3.946 2.293 7.587 5.924 9.13A27.75 27.75 0 0 1-32.011 7.096c1.543 3.632 5.183 5.925 9.13 5.925H-9.54C-2.777 13.021 2.015 6.455 0 0Z"
transform="translate(323.605 309.987)"
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-13.342c-3.946 0-7.587 2.293-9.13 5.925a27.755 27.755 0 0 1-14.662 14.661c-3.632 1.542-5.925 5.184-5.925 9.129v13.344c0 6.761 6.566 11.553 13.021 9.539C-11.218 46.724 3.666 31.84 9.54 13.021 11.554 6.565 6.762 0 0 0Z"
transform="translate(314.065 353.008)"
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-13.366c0-6.772-6.575-11.541-13.042-9.534-9.203 2.856-17.633 7.924-24.64 14.933-7.009 7.007-12.075 15.438-14.931 24.64-2.008 6.467 2.762 13.042 9.533 13.042h13.365c3.945 0 7.587-2.292 9.129-5.923A27.756 27.756 0 0 1-5.924 9.129C-2.292 7.586 0 3.946 0 0Z"
transform="translate(241.007 293.293)"
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-13.343c0-3.946-2.292-7.587-5.924-9.13a27.757 27.757 0 0 1-14.662-14.662c-1.542-3.631-5.184-5.924-9.129-5.924h-13.342c-6.762 0-11.554 6.566-9.54 13.021 5.876 18.82 20.758 33.703 39.577 39.577C-6.565 11.554 0 6.762 0 0Z"
transform="translate(241.007 396.066)"
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 0c0-8.284 6.716-15 15-15 8.284 0 15 6.716 15 15 0 8.284-6.716 15-15 15C6.716 15 0 8.284 0 0Z"
transform="translate(241 338)"
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-12"
transform="translate(193.465 469.555)"
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-12"
transform="translate(318.362 469.555)"
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 0c0-7.983-6.472-14.456-14.456-14.456-7.983 0-14.455 6.473-14.455 14.456"
transform="translate(256.096 450.4)"
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 0c0-7.983-6.472-14.456-14.456-14.456-7.983 0-14.455 6.473-14.455 14.456"
transform="translate(285.007 450.4)"
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-30c-5.523 0-10-4.477-10-10v-15c0-5.523 4.477-10 10-10H0c5.523 0 10 4.477 10 10v15C10-4.477 5.523 0 0 0Z"
transform="translate(87.5 223)"
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-30c-5.523 0-10-4.477-10-10v-15c0-5.523 4.477-10 10-10H0c5.523 0 10 4.477 10 10v15C10-4.477 5.523 0 0 0Z"
transform="translate(191 223)"
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-30c-5.523 0-10-4.477-10-10v-15c0-5.523 4.477-10 10-10H0c5.523 0 10 4.477 10 10v15C10-4.477 5.523 0 0 0Z"
transform="translate(271 223)"
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-30c-5.523 0-10-4.477-10-10v-15c0-5.523 4.477-10 10-10H0c5.523 0 10 4.477 10 10v15C10-4.477 5.523 0 0 0Z"
transform="translate(351 223)"
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-30c-5.523 0-10-4.477-10-10v-15c0-5.523 4.477-10 10-10H0c5.523 0 10 4.477 10 10v15C10-4.477 5.523 0 0 0Z"
transform="translate(454.5 223)"
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