Swatches

swatches

A 24px icon in Bloom’s Tools category, drawn once as Linear and grown into the other four styles. Free SVG files in currentColor, MIT license.

Category
Tools
Tags
palettecolorscolor pickerthemepaint chips

Swatches in five styles

Linear at 16, 20, 24 and 32px

Get the SVG

The command prints the file exactly as Bloom ships it. Set --style to line-duotone, outline, bold or bold-duotone for the other styles. The same files are in the npm package under dist/ and on this site under svg/.

npx -y bloom-icons get swatches --style linear
dist/linear/swatches.svg
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
  <path d="M20.531 13.001C20.563 13.017 20.594 13.033 20.625 13.051C20.967 13.249 21.251 13.533 21.449 13.875C21.75 14.397 21.75 15.098 21.75 16.5C21.75 17.902 21.75 18.603 21.449 19.125C21.251 19.467 20.967 19.751 20.625 19.949C20.103 20.25 19.402 20.25 18 20.25L13.741 20.25"/>
  <path d="M14.25 15.054L17.577 11.727C18.568 10.735 19.063 10.24 19.219 9.658C19.322 9.276 19.322 8.874 19.219 8.492C19.063 7.91 18.568 7.415 17.577 6.424C16.585 5.432 16.09 4.937 15.508 4.781C15.126 4.678 14.724 4.678 14.342 4.781C14.308 4.79 14.274 4.801 14.24 4.812"/>
  <path d="M7.5 2.25C8.902 2.25 9.603 2.25 10.125 2.551C10.467 2.749 10.751 3.033 10.949 3.375C11.25 3.897 11.25 4.598 11.25 6L11.25 16.5C11.25 17.902 11.25 18.603 10.949 19.125C10.751 19.467 10.467 19.751 10.125 19.949C9.603 20.25 8.902 20.25 7.5 20.25C6.098 20.25 5.397 20.25 4.875 19.949C4.533 19.751 4.249 19.467 4.051 19.125C3.75 18.603 3.75 17.902 3.75 16.5L3.75 6C3.75 4.598 3.75 3.897 4.051 3.375C4.249 3.033 4.533 2.749 4.875 2.551C5.397 2.25 6.098 2.25 7.5 2.25Z"/>
  <circle cx="7.5" cy="16.5" r="1.125" fill="currentColor" stroke="none"/>
</svg>

More in Tools

Open in the icon browserBrowse all 1,260 icons