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

Game Icons · GiSwirlRing

Swirl Ring icon

A free swirl ring icon from Game 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: CC BY 3.0 license
Project: game-icons.net

Download SVG

Install with shadcn

npx shadcn@latest add https://ui.cuelark.com/r/icons/game-icons/swirl-ring.json

components/icons/game-icons-swirl-ring.tsx

import * as React from "react";

/**
 * Swirl Ring from Game Icons (https://game-icons.net/), CC BY 3.0.
 * Via Cuelark UI: ui.cuelark.com/icons/game-icons/swirl-ring. Sized in em, colored by currentColor.
 */
export function GiSwirlRingIcon(props: React.SVGProps<SVGSVGElement>) {
  return (
    <svg
      aria-hidden="true"
      viewBox="0 0 512 512"
      stroke="currentColor"
      fill="currentColor"
      strokeWidth="0"
      width="1em"
      height="1em"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <path
        d="M231.07 20.854c130.555 79.7 225.307 195.886 220.758 277.41-.372 6.683-1.85 12.83-3.504 18.687-11.48-92.337-130.195-218.092-279.16-290.255-4.345-2.104-8.547-3.872-12.85-5.84H20.822v7.004c32.332 6.406 67.257 16.19 103.955 30.37C287.93 121.255 421.312 237.91 423.213 318.7c.13 5.782-.565 11.256-1.752 16.353-18.234-79.442-144.166-184.84-296.097-243.533C88.457 77.262 53.27 66.962 20.823 60.566v49.64c164.214 24.05 386.08 133.882 366.142 290.648-9.53 74.94-113.13 76.27-159.742 35.17 45.327 72.98 186.19 70.605 235.703 21.09 75.81-75.81 25.19-249.297-112.717-387.202-17.778-17.776-36.23-34.278-54.9-49.058h-64.24zm7.3 236.1c-15.488.026-29.213 4.776-39.155 14.718v.002c-18.66 18.66-18.67 50.702-3.938 82.69 1.353-13.847 6.2-26.328 15.75-35.878 27.665-27.664 80.464-20.165 117.692 17.063 23.264 23.266 34.894 52.858 33.686 78.313 15.033-30.094 1.188-77.565-35.875-114.63-27.348-27.35-60.554-42.322-88.16-42.278zm16.185 63.83c-12.806.1-22.824 4.544-26.412 13.015-6.38 15.06 9.98 37.144 36.537 49.327 26.56 12.184 53.26 9.852 59.638-5.207 6.38-15.06-9.98-37.147-36.537-49.33-11.62-5.33-23.265-7.882-33.225-7.805zm-41.022 22.226c-11.47 19.105-.906 49.236 27.373 72.763 32.573 27.1 76.033 35.056 97.143 17.498 14.236-11.843 14.244-32.184 3.003-52.49-1.032 8.79-4.73 16.712-12.016 22.775-21.11 17.56-61.394 12.8-89.8-10.832-17.75-14.772-26.625-33.555-25.704-49.713z"
      />
    </svg>
  );
}

With react-icons

import { GiSwirlRing } from "react-icons/gi";

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

swirl-ring.svg

<svg
  viewBox="0 0 512 512"
  stroke="currentColor"
  fill="currentColor"
  stroke-width="0"
  width="1em"
  height="1em"
  xmlns="http://www.w3.org/2000/svg"
>
  <path
    d="M231.07 20.854c130.555 79.7 225.307 195.886 220.758 277.41-.372 6.683-1.85 12.83-3.504 18.687-11.48-92.337-130.195-218.092-279.16-290.255-4.345-2.104-8.547-3.872-12.85-5.84H20.822v7.004c32.332 6.406 67.257 16.19 103.955 30.37C287.93 121.255 421.312 237.91 423.213 318.7c.13 5.782-.565 11.256-1.752 16.353-18.234-79.442-144.166-184.84-296.097-243.533C88.457 77.262 53.27 66.962 20.823 60.566v49.64c164.214 24.05 386.08 133.882 366.142 290.648-9.53 74.94-113.13 76.27-159.742 35.17 45.327 72.98 186.19 70.605 235.703 21.09 75.81-75.81 25.19-249.297-112.717-387.202-17.778-17.776-36.23-34.278-54.9-49.058h-64.24zm7.3 236.1c-15.488.026-29.213 4.776-39.155 14.718v.002c-18.66 18.66-18.67 50.702-3.938 82.69 1.353-13.847 6.2-26.328 15.75-35.878 27.665-27.664 80.464-20.165 117.692 17.063 23.264 23.266 34.894 52.858 33.686 78.313 15.033-30.094 1.188-77.565-35.875-114.63-27.348-27.35-60.554-42.322-88.16-42.278zm16.185 63.83c-12.806.1-22.824 4.544-26.412 13.015-6.38 15.06 9.98 37.144 36.537 49.327 26.56 12.184 53.26 9.852 59.638-5.207 6.38-15.06-9.98-37.147-36.537-49.33-11.62-5.33-23.265-7.882-33.225-7.805zm-41.022 22.226c-11.47 19.105-.906 49.236 27.373 72.763 32.573 27.1 76.033 35.056 97.143 17.498 14.236-11.843 14.244-32.184 3.003-52.49-1.032 8.79-4.73 16.712-12.016 22.775-21.11 17.56-61.394 12.8-89.8-10.832-17.75-14.772-26.625-33.555-25.704-49.713z"
  />
</svg>

Attribution

"Swirl Ring" icon from Game Icons (https://game-icons.net/), licensed under CC BY 3.0 license.

Related icons:

Similar Game Icons icons