Skip to content
Cuelark UI

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

Remix Icon · RiPingPongLine

Ping Pong Line icon

A free ping pong line icon from Remix Icon, 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
Apache License Version 2.0
Project
github.com
Install with shadcn
npx shadcn@latest add https://ui.cuelark.com/r/icons/remix/ping-pong-line.json
components/icons/remix-ping-pong-line.tsx
import * as React from "react";

/**
 * Ping Pong Line from Remix Icon (https://github.com/Remix-Design/RemixIcon), Apache License Version 2.0.
 * Via Cuelark UI: ui.cuelark.com/icons/remix/ping-pong-line. Sized in em, colored by currentColor.
 */
export function RiPingPongLineIcon(props: React.SVGProps<SVGSVGElement>) {
  return (
    <svg
      aria-hidden="true"
      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="M11.5 2C16.7467 2 21 6.25329 21 11.5C21 13.0291 20.6387 14.4739 19.9969 15.7536L22.4602 18.2175C22.8507 18.608 22.8507 19.2412 22.4602 19.6317L19.6317 22.4602C19.2412 22.8507 18.608 22.8507 18.2175 22.4602L15.7536 19.9969C14.4739 20.6387 13.0291 21 11.5 21C6.25329 21 2 16.7467 2 11.5C2 6.25329 6.25329 2 11.5 2ZM16.8033 15.3877L15.3891 16.8019L18.9246 20.3375L20.3388 18.9233L16.8033 15.3877ZM18.6669 9.28305L9.28305 18.6669C9.98371 18.8834 10.7282 19 11.5 19C12.4671 19 13.3914 18.817 14.2403 18.4836L13.2678 17.5104C12.8772 17.1199 12.8772 16.4867 13.2678 16.0962L16.0962 13.2678C16.4867 12.8772 17.1199 12.8772 17.5104 13.2678L18.4836 14.2403C18.817 13.3914 19 12.4671 19 11.5C19 10.7282 18.8834 9.98371 18.6669 9.28305ZM11.5 4C7.35786 4 4 7.35786 4 11.5C4 14.1135 5.3368 16.4148 7.36394 17.7574L17.7574 7.36394C16.4148 5.3368 14.1135 4 11.5 4Z"
      />
    </svg>
  );
}
With react-icons
import { RiPingPongLine } from "react-icons/ri";

export function Example() {
  return <RiPingPongLine className="size-5" />;
}
ping-pong-line.svg
<svg
  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="M11.5 2C16.7467 2 21 6.25329 21 11.5C21 13.0291 20.6387 14.4739 19.9969 15.7536L22.4602 18.2175C22.8507 18.608 22.8507 19.2412 22.4602 19.6317L19.6317 22.4602C19.2412 22.8507 18.608 22.8507 18.2175 22.4602L15.7536 19.9969C14.4739 20.6387 13.0291 21 11.5 21C6.25329 21 2 16.7467 2 11.5C2 6.25329 6.25329 2 11.5 2ZM16.8033 15.3877L15.3891 16.8019L18.9246 20.3375L20.3388 18.9233L16.8033 15.3877ZM18.6669 9.28305L9.28305 18.6669C9.98371 18.8834 10.7282 19 11.5 19C12.4671 19 13.3914 18.817 14.2403 18.4836L13.2678 17.5104C12.8772 17.1199 12.8772 16.4867 13.2678 16.0962L16.0962 13.2678C16.4867 12.8772 17.1199 12.8772 17.5104 13.2678L18.4836 14.2403C18.817 13.3914 19 12.4671 19 11.5C19 10.7282 18.8834 9.98371 18.6669 9.28305ZM11.5 4C7.35786 4 4 7.35786 4 11.5C4 14.1135 5.3368 16.4148 7.36394 17.7574L17.7574 7.36394C16.4148 5.3368 14.1135 4 11.5 4Z"
  />
</svg>
Attribution
"Ping Pong Line" icon from Remix Icon (https://github.com/Remix-Design/RemixIcon), licensed under Apache License Version 2.0.

Related icons: