Add icons to this collection by clicking the heart icon.
Ui Design icon - also known as technology, interface, draw, tablet, pen, digital, illustration, ui, device, wacom, and ui design. Created in a clean lineal color style with a white, silver, blue, navy, and pink 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="b" clipPathUnits="userSpaceOnUse">
<path d="M0 512h512V0H0Z" />
</clipPath>
<clipPath id="c" clipPathUnits="userSpaceOnUse">
<path d="M38.389 432.784H473.61V118.595H38.389Z" />
</clipPath>
<linearGradient
id="a"
x1="0"
x2="1"
y1="0"
y2="0"
gradientTransform="matrix(639.07092 0 0 -639.07092 225.816 256)"
gradientUnits="userSpaceOnUse"
spreadMethod="pad"
>
<stop offset="0" stop-opacity="1" stop-color="#ffeadb" />
<stop offset=".001" stop-opacity="1" stop-color="#ffeadb" />
<stop offset="1" stop-opacity="1" stop-color="#e0cdf5" />
</linearGradient>
</defs>
<path
d="M288.088 448.087c-38.094-.654-71.787-19.354-92.904-47.919-18.185-24.599-46.491-39.965-77.081-39.949-.898 0-1.797-.009-2.7-.03C53.487 358.836.837 305.713.011 243.787c-.879-65.932 52.302-119.654 118.032-119.654 50.947 0 94.349 32.277 110.886 77.497 4.327 11.832 17.153 18.173 29.283 14.772l.454-.127c11.1-3.064 18.458-13.64 17.549-25.119-1.216-15.382.582-31.255 5.799-46.795 20.521-61.134 87.188-94.685 148.493-74.68 62.713 20.464 96.38 88.184 75.119 150.401-11.827 34.611-38.138 60.16-69.851 72.202a42.767 42.767 0 0 0-27.587 39.43c-.007.383-.013.768-.022 1.153-1.49 63.9-54.358 115.236-118.039 115.238-.68 0-1.357-.006-2.039-.018"
transform="matrix(1.33333 0 0 -1.33333 0 682.667)"
fill="url(#a)"
stroke="none"
/>
<g clip-path="url(#b)" transform="matrix(1.33333 0 0 -1.33333 0 682.667)">
<g clip-path="url(#c)" opacity=".1">
<path
d="M0 0h-369.928c-8.279 0-14.997-6.718-14.997-14.996v-173.063l-32.753-58.527a19.996 19.996 0 0 1 3.805-24.383l28.948-27.019v-1.203c0-8.279 6.718-14.997 14.997-14.997H0c8.278 0 14.997 6.718 14.997 14.997v284.195C14.997-6.718 8.278 0 0 0"
transform="translate(458.614 432.783)"
fill="#2626bc"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
</g>
<path
d="M0 0v-284.195c0-8.279-6.719-14.997-14.997-14.997h-369.928c-8.279 0-14.997 6.718-14.997 14.997V0c0 8.278 6.718 14.997 14.997 14.997h369.928C-6.719 14.997 0 8.278 0 0"
transform="translate(473.611 396.791)"
fill="#fff"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0h-162.202a3 3 0 0 0-2.999 2.999V158.6a3 3 0 0 0 2.999 3H0a3 3 0 0 0 3-3V2.999A3 3 0 0 0 0 0"
transform="translate(340.665 136.85)"
fill="#97ffd2"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0v80.318c0 8.279-6.719 14.997-14.997 14.997h-369.928c-8.279 0-14.997-6.718-14.997-14.997V0Z"
transform="translate(473.611 316.473)"
fill="#b7c5ff"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0v33.165c0 8.282-6.715 14.997-14.997 14.997h-369.928c-8.283 0-14.997-6.715-14.997-14.997V0Z"
transform="translate(473.611 363.626)"
fill="#6583fe"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0h399.922"
transform="translate(73.689 363.626)"
fill="none"
stroke="#2626bc"
stroke-width="10"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
stroke-dasharray="none"
stroke-opacity="1"
/>
<path
d="M0 0v-.145"
transform="translate(111.763 387.78)"
fill="none"
stroke="#2626bc"
stroke-width="10"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
stroke-dasharray="none"
stroke-opacity="1"
/>
<path
d="M0 0v-.145"
transform="translate(131.084 387.78)"
fill="none"
stroke="#2626bc"
stroke-width="10"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
stroke-dasharray="none"
stroke-opacity="1"
/>
<path
d="M0 0v-.145"
transform="translate(150.405 387.78)"
fill="none"
stroke="#2626bc"
stroke-width="10"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
stroke-dasharray="none"
stroke-opacity="1"
/>
<path
d="M0 0v139.901"
transform="translate(73.689 223.725)"
fill="none"
stroke="#2626bc"
stroke-width="10"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
stroke-dasharray="none"
stroke-opacity="1"
/>
<path
d="M0 0v5.63c0 8.282 6.714 14.997 14.997 14.997h369.928c8.283 0 14.997-6.715 14.997-14.997v-284.192c0-8.283-6.714-14.998-14.997-14.998H117.727"
transform="translate(73.689 391.161)"
fill="none"
stroke="#2626bc"
stroke-width="10"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
stroke-dasharray="none"
stroke-opacity="1"
/>
<path
d="m0 0-10.992 10.993L0 21.986l10.993-10.993Z"
transform="translate(328.065 52.423)"
fill="none"
stroke="#01eca5"
stroke-width="10"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
stroke-dasharray="none"
stroke-opacity="1"
/>
<path
d="m0 0-10.993 10.993L0 21.986l10.993-10.993Z"
transform="translate(224.952 444.975)"
fill="none"
stroke="#6583fe"
stroke-width="10"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
stroke-dasharray="none"
stroke-opacity="1"
/>
<path
d="M0 0c0-6.083-4.931-11.014-11.014-11.014C-4.931-11.014 0-15.944 0-22.027c0 6.083 4.931 11.013 11.014 11.013C4.931-11.014 0-6.083 0 0Z"
transform="translate(376.45 50.027)"
fill="none"
stroke="#97ffd2"
stroke-width="10"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
stroke-dasharray="none"
stroke-opacity="1"
/>
<path
d="M0 0c0-6.083-4.932-11.014-11.014-11.014C-4.932-11.014 0-15.944 0-22.027c0 6.083 4.931 11.013 11.014 11.013C4.931-11.014 0-6.083 0 0Z"
transform="translate(270.578 484)"
fill="none"
stroke="#01eca5"
stroke-width="10"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
stroke-dasharray="none"
stroke-opacity="1"
/>
<path
d="M0 0h-75.985a2.999 2.999 0 0 0-2.999 2.999v187.964a2.999 2.999 0 0 0 2.999 2.999H0a3 3 0 0 0 2.999-2.999V2.999A3 3 0 0 0 0 0"
transform="translate(444.856 131.615)"
fill="#ffc4df"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0h-75.985a2.999 2.999 0 0 0-2.999 2.999v187.964a2.999 2.999 0 0 0 2.999 2.999H0a3 3 0 0 0 2.999-2.999V2.999A3 3 0 0 0 0 0"
transform="translate(444.856 131.615)"
fill="#ffc4df"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0h-81.983v19.485a2.998 2.998 0 0 0 2.999 2.999h75.985A2.999 2.999 0 0 0 0 19.485Z"
transform="translate(447.854 303.093)"
fill="#ff7eb8"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M447.854 222.037h-81.983v22.485h81.983z"
fill="#ff7eb8"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0h-20.329a3 3 0 0 0-2.999 2.999v2.5a3 3 0 0 0 2.999 2.999H0a3 3 0 0 0 3-2.999v-2.5A3 3 0 0 0 0 0"
transform="translate(398.947 201.34)"
fill="#b7c5ff"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0h-20.329a3 3 0 0 0-3 2.999v2.5a3 3 0 0 0 3 2.999H0a3 3 0 0 0 2.999-2.999v-2.5A3 3 0 0 0 0 0"
transform="translate(435.107 201.34)"
fill="#b7c5ff"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0h-20.329a3 3 0 0 0-2.999 3v2.499a3 3 0 0 0 2.999 3H0a3 3 0 0 0 3-3V3a3 3 0 0 0-3-3"
transform="translate(398.947 187.092)"
fill="#b7c5ff"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0h-20.329a3 3 0 0 0-3 3v2.499a3 3 0 0 0 3 3H0a3 3 0 0 0 2.999-3V3A3 3 0 0 0 0 0"
transform="translate(435.107 187.092)"
fill="#b7c5ff"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0h-20.329a3 3 0 0 0-2.999 3v2.499a3 3 0 0 0 2.999 3H0a3 3 0 0 0 3-3V3a3 3 0 0 0-3-3"
transform="translate(398.947 172.845)"
fill="#b7c5ff"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0h-20.329a3 3 0 0 0-3 3v2.499a3 3 0 0 0 3 3H0a3 3 0 0 0 2.999-3V3A3 3 0 0 0 0 0"
transform="translate(435.107 172.845)"
fill="#b7c5ff"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0v78.425a3 3 0 0 1-3 2.999h-39.992a3 3 0 0 1-2.999-2.999V0a3 3 0 0 1 2.999-3H-3a3 3 0 0 1 3 3"
transform="translate(157.754 244.153)"
fill="#ffc4df"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0v78.425a3 3 0 0 1-3 2.999h-39.992a3 3 0 0 1-2.999-2.999V0a3 3 0 0 1 2.999-3H-3a3 3 0 0 1 3 3"
transform="translate(157.754 244.153)"
fill="#ffc4df"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0h-45.991v19.485a2.999 2.999 0 0 0 2.999 2.999H-3c1.657 0 3-1.342 3-2.999z"
transform="translate(157.754 303.093)"
fill="#ff7eb8"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0h-53.323c-5.522 0-9.998 4.477-9.998 9.998v21.996H9.998V9.998C9.998 4.477 5.522 0 0 0"
transform="translate(138.425 63)"
fill="#4369fd"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M148.423 94.994H75.104V75h73.319z"
fill="#2d58e0"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0h-53.323c-5.522 0-9.998 4.477-9.998 9.998v21.996H9.998V9.998C9.998 4.477 5.522 0 0 0Z"
transform="translate(138.425 63)"
fill="none"
stroke="#2626bc"
stroke-width="10"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
stroke-dasharray="none"
stroke-opacity="1"
/>
<path
d="M0 0h53.716L93.88 37.49a19.995 19.995 0 0 1 3.806 24.382L33.197 177.108c-2.774 4.956-9.905 4.956-12.677 0L-43.969 61.872a19.995 19.995 0 0 1 3.805-24.382z"
transform="translate(84.905 103.325)"
fill="#b7c5ff"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0h53.716L93.88 37.49a19.995 19.995 0 0 1 3.806 24.382L33.197 177.108c-2.774 4.956-9.905 4.956-12.677 0L-43.969 61.872a19.995 19.995 0 0 1 3.805-24.382z"
transform="translate(84.905 103.325)"
fill="none"
stroke="#2626bc"
stroke-width="10"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
stroke-dasharray="none"
stroke-opacity="1"
/>
<path
d="M0 0v-95.283"
transform="translate(111.763 280.291)"
fill="none"
stroke="#2626bc"
stroke-width="10"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
stroke-dasharray="none"
stroke-opacity="1"
/>
<path
d="M0 0c0-11.025-8.938-19.965-19.965-19.965-11.026 0-19.965 8.94-19.965 19.965 0 11.026 8.939 19.966 19.965 19.966C-8.938 19.966 0 11.026 0 0"
transform="translate(131.728 162.314)"
fill="#8399fe"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0c0-11.025-8.938-19.965-19.965-19.965-11.026 0-19.965 8.94-19.965 19.965 0 11.026 8.939 19.966 19.965 19.966C-8.938 19.966 0 11.026 0 0Z"
transform="translate(131.728 162.314)"
fill="none"
stroke="#2626bc"
stroke-width="10"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
stroke-dasharray="none"
stroke-opacity="1"
/>
<path
d="M0 0h-81.529c-5.522 0-9.998 4.476-9.998 9.998v5.762c0 5.522 4.476 9.998 9.998 9.998H0c5.522 0 9.999-4.476 9.999-9.998V9.998C9.999 4.476 5.522 0 0 0"
transform="translate(152.528 86.8)"
fill="#01eca5"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0h-81.529c-5.522 0-9.998 4.476-9.998 9.998v5.762c0 5.522 4.476 9.998 9.998 9.998H0c5.522 0 9.999-4.476 9.999-9.998V9.998C9.999 4.476 5.522 0 0 0Z"
transform="translate(152.528 86.8)"
fill="none"
stroke="#2626bc"
stroke-width="10"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
stroke-dasharray="none"
stroke-opacity="1"
/>
<path
d="M0 0h-111.312a4.999 4.999 0 0 0-4.999 4.999v89.638a4.999 4.999 0 0 0 4.999 4.999H0a4.999 4.999 0 0 0 4.999-4.999V4.999A4.999 4.999 0 0 0 0 0Z"
transform="translate(317.469 172.845)"
fill="none"
stroke="#01eca5"
stroke-width="10"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
stroke-dasharray="none"
stroke-opacity="1"
/>
<path
d="M0 0h118.471"
transform="translate(203.997 236.75)"
fill="none"
stroke="#01eca5"
stroke-width="10"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
stroke-dasharray="none"
stroke-opacity="1"
/>
<path
d="M0 0v-63.905"
transform="translate(287.98 236.75)"
fill="none"
stroke="#01eca5"
stroke-width="10"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
stroke-dasharray="none"
stroke-opacity="1"
/>
<path
d="M0 0h19.344a4.03 4.03 0 1 1 0 8.063H0A4.032 4.032 0 1 1 0 0"
transform="translate(115.795 334.022)"
fill="#ffc4df"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0h19.344a4.032 4.032 0 1 1 0 8.063H0A4.032 4.032 0 1 1 0 0"
transform="translate(161.786 334.022)"
fill="#ffc4df"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0h19.344a4.032 4.032 0 1 1 0 8.063H0A4.032 4.032 0 1 1 0 0"
transform="translate(207.777 334.022)"
fill="#ffc4df"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0h19.344a4.032 4.032 0 1 1 0 8.063H0A4.032 4.032 0 1 1 0 0"
transform="translate(253.769 334.022)"
fill="#ffc4df"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0h19.344a4.032 4.032 0 0 1 0 8.063H0A4.031 4.031 0 1 1 0 0"
transform="translate(299.76 334.022)"
fill="#ffc4df"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
</g>
</svg>
More icons in the same style and category