Hover the icon or press Play. Suggested motion: pop. Pick another to preview it and update the animated code:

Simple Icons · SiIconify

Iconify icon

A free iconify icon from Simple Icons, ready for React. Use it static or animated: both versions are below, copy-paste or one shadcn command away. Sized in em and colored by currentColor.

License: CC0 1.0 Universal license
Project: simpleicons.org

Download SVG

Install with shadcn

npx shadcn@latest add https://ui.cuelark.com/r/icons/simple-icons/iconify.json

components/icons/simple-icons-iconify.tsx

import * as React from "react";

/**
 * Iconify from Simple Icons (https://simpleicons.org/), CC0 1.0 Universal.
 * Via Cuelark UI: ui.cuelark.com/icons/simple-icons/iconify. Sized in em, colored by currentColor.
 */
export function SiIconifyIcon(props: React.SVGProps<SVGSVGElement>) {
  return (
    <svg
      aria-hidden="true"
      role="img"
      viewBox="0 0 24 24"
      stroke="currentColor"
      fill="currentColor"
      strokeWidth="0"
      width="1em"
      height="1em"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <path
        d="M2.8571 19.4286V9.6423c.232-.06.4583-.1577.6703-.2949L5.143 8.3023v9.9834h4.5714v2.2857H4c-.6309 0-1.1429-.512-1.1429-1.1428Zm7.4286-8.5714c0-.9463.768-1.7143 1.7143-1.7143.9463 0 1.7143.768 1.7143 1.7143 0 .9511-.7751 1.7142-1.7143 1.7142-.9392 0-1.7143-.7631-1.7143-1.7142zm-5.1428-8V1.1429C5.1429.512 5.6549 0 6.2857 0c.6309 0 1.1429.512 1.1429 1.1429v.2354zm9.1428 15.4285h4.5715V8.3023l1.6154 1.0451c.212.1372.4383.2349.6703.2949v9.7863c0 .6308-.512 1.1429-1.1429 1.1429h-5.7143Zm-.0034-17.0274 8.0531 5.2109c.5292.3428.6812 1.0508.3383 1.5805-.3428.5292-1.0508.6812-1.5805.3383L13.052 3.1846l.1897-.1229c.64-.4143 1.004-1.0954 1.0406-1.8034ZM11.3789.1834c.5297-.3428 1.2377-.1908 1.5805.3383.3429.5297.1909 1.2377-.3383 1.5806L2.907 8.388c-.5298.3429-1.2378.1909-1.5806-.3383-.3429-.5297-.1909-1.2377.3383-1.5805Zm2.6005 22.1023H22c.4732 0 .8572.384.8572.8572A.8575.8575 0 0 1 22 24H2a.8575.8575 0 0 1-.8571-.8571c0-.4732.384-.8572.8571-.8572h8.0206c.3954.6829 1.1343 1.1429 1.9794 1.1429s1.584-.46 1.9794-1.1429zm-.8365-8.8097v7.6669c0 .6308-.512 1.1428-1.1429 1.1428s-1.1429-.512-1.1429-1.1428V13.476a2.8453 2.8453 0 0 0 1.143.2383c.4062 0 .7925-.0851 1.1428-.2383z"
      />
    </svg>
  );
}

With react-icons

import { SiIconify } from "react-icons/si";

export function Example() {
  return <SiIconify className="size-5" />;
}

iconify.svg

<svg
  role="img"
  viewBox="0 0 24 24"
  stroke="currentColor"
  fill="currentColor"
  stroke-width="0"
  width="1em"
  height="1em"
  xmlns="http://www.w3.org/2000/svg"
>
  <path
    d="M2.8571 19.4286V9.6423c.232-.06.4583-.1577.6703-.2949L5.143 8.3023v9.9834h4.5714v2.2857H4c-.6309 0-1.1429-.512-1.1429-1.1428Zm7.4286-8.5714c0-.9463.768-1.7143 1.7143-1.7143.9463 0 1.7143.768 1.7143 1.7143 0 .9511-.7751 1.7142-1.7143 1.7142-.9392 0-1.7143-.7631-1.7143-1.7142zm-5.1428-8V1.1429C5.1429.512 5.6549 0 6.2857 0c.6309 0 1.1429.512 1.1429 1.1429v.2354zm9.1428 15.4285h4.5715V8.3023l1.6154 1.0451c.212.1372.4383.2349.6703.2949v9.7863c0 .6308-.512 1.1429-1.1429 1.1429h-5.7143Zm-.0034-17.0274 8.0531 5.2109c.5292.3428.6812 1.0508.3383 1.5805-.3428.5292-1.0508.6812-1.5805.3383L13.052 3.1846l.1897-.1229c.64-.4143 1.004-1.0954 1.0406-1.8034ZM11.3789.1834c.5297-.3428 1.2377-.1908 1.5805.3383.3429.5297.1909 1.2377-.3383 1.5806L2.907 8.388c-.5298.3429-1.2378.1909-1.5806-.3383-.3429-.5297-.1909-1.2377.3383-1.5805Zm2.6005 22.1023H22c.4732 0 .8572.384.8572.8572A.8575.8575 0 0 1 22 24H2a.8575.8575 0 0 1-.8571-.8571c0-.4732.384-.8572.8571-.8572h8.0206c.3954.6829 1.1343 1.1429 1.9794 1.1429s1.584-.46 1.9794-1.1429zm-.8365-8.8097v7.6669c0 .6308-.512 1.1428-1.1429 1.1428s-1.1429-.512-1.1429-1.1428V13.476a2.8453 2.8453 0 0 0 1.143.2383c.4062 0 .7925-.0851 1.1428-.2383z"
  />
</svg>

Attribution

"Iconify" icon from Simple Icons (https://simpleicons.org/), licensed under CC0 1.0 Universal license.

Similar Simple Icons icons