next-icons-logoNext IconsAll Icons
export type IconProps = {
  size?: number | string;
  color?: string;
  className?: string;
} & React.SVGProps<SVGSVGElement>;

export const LinkIcon = ({
  size = 24,
  color = "currentColor",
  className,
  ...props
}: IconProps) => (
  <svg
    xmlns="http://www.w3.org/2000/svg"
    viewBox="0 0 24 24"
    width={size}
    height={size}
    fill={color}
    className={className}
    {...props}
  >
      <path d="M9.88 18.36a3 3 0 0 1-4.24 0 3 3 0 0 1 0-4.24l2.83-2.83-1.41-1.41-2.83 2.83a5.003 5.003 0 0 0 0 7.07c.98.97 2.25 1.46 3.54 1.46s2.56-.49 3.54-1.46l2.83-2.83-1.41-1.41-2.83 2.83ZM12.71 4.22 9.88 7.05l1.41 1.41 2.83-2.83a3 3 0 0 1 4.24 0 3 3 0 0 1 0 4.24l-2.83 2.83 1.41 1.41 2.83-2.83a5.003 5.003 0 0 0 0-7.07 5.003 5.003 0 0 0-7.07 0Z" />
      <path d="m16.95 8.46-.71-.7-.7-.71-4.25 4.24-4.24 4.25.71.7.7.71 4.25-4.24z" />
  </svg>
);

Icon

Link

Category

text-editor

Use case

Use this icon in navbar items, social link groups, profile actions, settings rows, and call-to-action buttons.

Size

48px

Color

#18181b

Related text-editor icons

AlignCenterAlignLeftAlignRightBoldBorderRadiusCapitalizeCheckListFontColor