Add icons to this collection by clicking the heart icon.
Swatches icon - also known as art, paint, color, palette, colours, squares, swatch, paint swatch, designer, miscellaneous, workspace, art and design, swatches, and edit tools. Created in a clean lineal color style with a silver, black, 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="a" clipPathUnits="userSpaceOnUse">
<path d="M0 512h512V0H0Z" />
</clipPath>
<clipPath id="b" clipPathUnits="userSpaceOnUse">
<path d="M0 512h512V0H0Z" />
</clipPath>
<clipPath id="c" clipPathUnits="userSpaceOnUse">
<path d="M0 512h512V0H0Z" />
</clipPath>
<clipPath id="d" clipPathUnits="userSpaceOnUse">
<path d="M0 512h512V0H0Z" />
</clipPath>
<clipPath id="e" clipPathUnits="userSpaceOnUse">
<path d="M0 512h512V0H0Z" />
</clipPath>
<clipPath id="f" clipPathUnits="userSpaceOnUse">
<path d="M0 512h512V0H0Z" />
</clipPath>
</defs>
<path
d="M339.75 436.33H166V326.918h173.75z"
transform="matrix(1.33333 0 0 -1.33333 0 682.667)"
fill="#a6ffb5"
fill-opacity="1"
fill-rule="nonzero"
stroke="#000"
stroke-width="20"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
stroke-dasharray="none"
stroke-opacity="1"
/>
<path
d="M0 0h-24.778v-109.412H129V0H82.667"
transform="matrix(1.33333 0 0 -1.33333 49.333 100.894)"
fill="#b6baf2"
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-24.778v-109.412H129V0H82.667"
transform="translate(37 436.33)"
fill="none"
stroke="#000"
stroke-width="20"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
stroke-dasharray="none"
stroke-opacity="1"
/>
</g>
<path
d="M500.667 436.33H339.75V326.918h160.917z"
transform="matrix(1.33333 0 0 -1.33333 0 682.667)"
fill="#fff68e"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<g clip-path="url(#b)" transform="matrix(1.33333 0 0 -1.33333 0 682.667)">
<path
d="M500.667 436.33H339.75V326.918h160.917z"
fill="none"
stroke="#000"
stroke-width="20"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
stroke-dasharray="none"
stroke-opacity="1"
/>
</g>
<path
d="M166 326.917H12.222V213.956H166Z"
transform="matrix(1.33333 0 0 -1.33333 0 682.667)"
fill="#9ee2f8"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<g clip-path="url(#c)" transform="matrix(1.33333 0 0 -1.33333 0 682.667)">
<path
d="M166 326.917H12.222V213.956H166Z"
fill="none"
stroke="#000"
stroke-width="20"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
stroke-dasharray="none"
stroke-opacity="1"
/>
</g>
<path
d="M339.75 213.957h160.917v112.961H339.75Z"
transform="matrix(1.33333 0 0 -1.33333 0 682.667)"
fill="#9ee2f8"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<g clip-path="url(#d)" transform="matrix(1.33333 0 0 -1.33333 0 682.667)">
<path
d="M339.75 213.957h160.917v112.961H339.75Z"
fill="none"
stroke="#000"
stroke-width="20"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
stroke-dasharray="none"
stroke-opacity="1"
/>
</g>
<path
d="M339.75 104.957h160.917v109H339.75Z"
transform="matrix(1.33333 0 0 -1.33333 0 682.667)"
fill="#b6baf2"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<g clip-path="url(#e)" transform="matrix(1.33333 0 0 -1.33333 0 682.667)">
<path
d="M339.75 104.957h160.917v109H339.75Z"
fill="none"
stroke="#000"
stroke-width="20"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
stroke-dasharray="none"
stroke-opacity="1"
/>
</g>
<path
d="M0 0v-109h173.839V0"
transform="matrix(1.33333 0 0 -1.33333 221.381 397.391)"
fill="#a6ffb5"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0v14.957h-153.778v-109H0V-73"
transform="matrix(1.33333 0 0 -1.33333 221.333 417.333)"
fill="#fff68e"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<g clip-path="url(#f)" transform="matrix(1.33333 0 0 -1.33333 0 682.667)">
<path
d="M0 0v14.957h-153.778v-109H0V-73"
transform="translate(166 199)"
fill="none"
stroke="#000"
stroke-width="20"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
stroke-dasharray="none"
stroke-opacity="1"
/>
</g>
<path
d="M0 0h173.75v109"
transform="matrix(1.33333 0 0 -1.33333 221.333 542.725)"
fill="none"
stroke="#000"
stroke-width="20"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
stroke-dasharray="none"
stroke-opacity="1"
/>
<path
d="m0 0-106.355-112.961h47.942L47.942 0Z"
transform="matrix(1.33333 0 0 -1.33333 376.327 246.777)"
fill="#b6baf2"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="m0 0-106.355-112.961h47.942L47.942 0Z"
transform="matrix(1.33333 0 0 -1.33333 376.327 246.777)"
fill="none"
stroke="#000"
stroke-width="20"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
stroke-dasharray="none"
stroke-opacity="1"
/>
<path
d="m0 0-68.303-72.546v-40.415h9.89L47.942 0Z"
transform="matrix(1.33333 0 0 -1.33333 312.405 246.777)"
fill="#b6baf2"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="m0 0-68.303-72.546v-40.415h9.89L47.942 0Z"
transform="matrix(1.33333 0 0 -1.33333 312.405 246.777)"
fill="none"
stroke="#000"
stroke-width="20"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
stroke-dasharray="none"
stroke-opacity="1"
/>
<path
d="M0 0v-72.546L68.303 0Z"
transform="matrix(1.33333 0 0 -1.33333 221.333 246.777)"
fill="#b6baf2"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0v-72.546L68.303 0Z"
transform="matrix(1.33333 0 0 -1.33333 221.333 246.777)"
fill="none"
stroke="#000"
stroke-width="20"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
stroke-dasharray="none"
stroke-opacity="1"
/>
<path
d="M0 0h-9.563l-106.354-112.961h47.941L0-40.763Z"
transform="matrix(1.33333 0 0 -1.33333 453 246.777)"
fill="#b6baf2"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="M0 0h-9.563l-106.354-112.961h47.941L0-40.763Z"
transform="matrix(1.33333 0 0 -1.33333 453 246.777)"
fill="none"
stroke="#000"
stroke-width="20"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
stroke-dasharray="none"
stroke-opacity="1"
/>
<path
d="m0 0-67.976-72.198H0Z"
transform="matrix(1.33333 0 0 -1.33333 453 301.128)"
fill="#b6baf2"
fill-opacity="1"
fill-rule="nonzero"
stroke="none"
/>
<path
d="m0 0-67.976-72.198H0Z"
transform="matrix(1.33333 0 0 -1.33333 453 301.128)"
fill="none"
stroke="#000"
stroke-width="20"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
stroke-dasharray="none"
stroke-opacity="1"
/>
<path
d="m0 0-.072.178"
transform="matrix(1.33333 0 0 -1.33333 105.313 101.013)"
fill="none"
stroke="#000"
stroke-width="20"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
stroke-dasharray="none"
stroke-opacity="1"
/>
<path
d="m0 0-.072.178"
transform="matrix(1.33333 0 0 -1.33333 221.381 467.556)"
fill="none"
stroke="#000"
stroke-width="20"
stroke-linecap="round"
stroke-linejoin="round"
stroke-miterlimit="10"
stroke-dasharray="none"
stroke-opacity="1"
/>
</svg>
More icons in the same style and category