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

export const PercentageIcon = ({
  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="m17.62 3-.84-.53-5.63 9-5.62 9 .85.53.84.53 5.63-9 5.62-9zM4 6.5C4 8.43 5.57 10 7.5 10S11 8.43 11 6.5 9.43 3 7.5 3 4 4.57 4 6.5M7.5 5C8.33 5 9 5.67 9 6.5S8.33 8 7.5 8 6 7.33 6 6.5 6.67 5 7.5 5M13 17.5c0 1.93 1.57 3.5 3.5 3.5s3.5-1.57 3.5-3.5-1.57-3.5-3.5-3.5-3.5 1.57-3.5 3.5m5 0c0 .83-.67 1.5-1.5 1.5s-1.5-.67-1.5-1.5.67-1.5 1.5-1.5 1.5.67 1.5 1.5" />
  </svg>
);

Icon

Percentage

Category

calculation

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 calculation icons

AmpersandAsteriskDivisionEqualFunctionGreaterThanGreaterThanEqualHashtag